.booking-event {
    position: relative;
    display: grid;
    grid-template-columns: 5rem 1fr auto;
    grid-template-rows: auto;
    gap: 1rem;
    align-items: center;
    background-color: #fff;
    color: currentColor;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.2);
    transition: background-color 0.2s ease-in-out;
}

@media (max-width: 540px) {
    .booking-event {
        grid-template-columns: 5rem 1fr;
    }

    .booking-event-inner {
        grid-row: 2 / 3;
        grid-column: 1 / 3;
    }

    .booking-event-details {
        grid-column: 1 / 3;
    }
}

.booking-event:hover,
.booking-event:focus,
.booking-event:focus-within {
    background-color: #f9f9f9;
}

.booking-event.is-participating .booking-event-icon,
.booking-event.is-available .booking-event-icon {
    background-color: #f8d768;
}

.booking-event:not(.is-available) .booking-event-icon::before {
    content: "\f133";
}

.booking-event.is-participating .booking-event-icon::before {
    content: "" !important;
    display: block;
    height: 2.5rem;
    width: 2.5rem;
    background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='511pt' height='511pt' viewBox='0 -10 512 511'%3E%3Cpath d='M143.727 195.426c15.39 0 31.332-1.617 47.382-4.801 7.98-1.582 24.883-5.969 41.754-11.29 32.551-10.265 37.711-15.401 40.192-17.87a15.009 15.009 0 0 0 2.683-17.625c-1.926-3.653-3.605-7.04-5.234-10.313-3.535-7.109-6.871-13.82-12.012-22.054-9.172-14.703-17.883-25.551-30.074-37.442-15.07-14.703-29.566-27.844-54.41-39.777-23.352-11.219-51.75-17.652-77.926-17.652-40.93 0-73.102 15.351-88.27 42.113-14.566 25.7-8.746 55.605 17.297 88.879 15.793 20.183 47.938 35.933 71.118 42.027 14.652 3.852 30.632 5.8 47.496 5.805zM329.813 147.918c.792 0 1.597-.063 2.398-.195 12.695-2.055 37.586-19.813 37.82-19.985 11.164-8.222 19.793-16.902 27.977-28.152 16.906-23.242 20.976-54.668 9.898-76.422C400.57 8.762 387.551.5 372.187.5c-10.355 0-21.316 3.738-32.585 11.105-19.844 12.973-32.348 35.97-35.211 64.754-2.403 24.133 2.53 48.95 12.867 64.766a15.007 15.007 0 0 0 12.555 6.793zM500.29 279.285c-23.25-56.12-76.661-92.922-137.024-94.922-15.266 38.969-13.055 92.723 6.433 143.473 21.254 55.34 60.45 99.434 100.973 115.23 39.738-42.754 53.375-106.425 29.617-163.78zm0 0'/%3E%3Cpath d='M341.691 338.59c-20.328-52.934-23.976-107.652-10.93-151.86a154.241 154.241 0 0 0-31.5 9.29c-24.023 9.945-51.562 31.312-78.195 60.043-.765 38.3 6.723 78.898 22.012 118.726 17.887 46.563 44.965 87.305 76.852 116.563 6.636.277 13.129.441 19.363.441 33.184 0 59.332-3.863 77.727-11.484a153.655 153.655 0 0 0 28.71-15.649c-43.152-22.344-81.894-68.414-104.039-126.07zM192.39 290.383a493.087 493.087 0 0 0-7.331 9.96c-35.946 50.204-57.41 99.731-57.41 132.493 0 14.398 14.917 22.488 27.906 27.93 12.449 5.21 29.734 10.43 49.992 15.09 22.148 5.093 46.02 9.132 69.453 11.87-24.492-28.792-45.16-63.734-59.926-102.183-12.129-31.594-19.75-63.742-22.683-95.16zm0 0'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.booking-event-icon.fa {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #e1e1e1;
    color: currentColor;
    flex: 0 1 5rem;
    aspect-ratio: 1;
    font-size: 2rem;
}

.booking-event-icon::before {
    content: "\f273";
}

.booking-event-data {
    margin-bottom: 0;
}

.booking-event-data.is-compact {
    line-height: 1.5;
    color: #9e9e9e;
}

.booking-event-data.is-compact .booking-event-data-item {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.booking-event-data.is-compact .booking-event-data-item-value {
    margin: 0;
}

.booking-event-data.is-compact .booking-event-data-item-name-text {
    font-size: 0;
}

.booking-event-data-item-name-icon {
    vertical-align: middle;
}

.booking-event-details {
    grid-column: 1 / 4;
}

.booking-event-details-toggle {
    position: absolute;
    visibility: hidden;
}

.booking-event-details-toggle:not(:checked) ~ .booking-event-details {
    display: none;
}

.booking-event-details-toggle-label {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    font-size: 0;
}

.booking-event-details-toggle-icon {
    margin-left: auto;
    padding: 1rem;
    font-size: 2rem;
}

.booking-event-details-toggle-icon::before {
    content: "\2212";
}

.booking-event-details-toggle:not(:checked) ~ .booking-event-details-toggle-icon::before {
    content: "\2b";
}

.booking-event-button {
    position: relative;
    z-index: 1;
    display: inline-block;
    background-color: #F8D768;
    color: currentColor;
    border-radius: 2rem;
    padding: 0.5rem 1.5rem;
    font-size: 1rem;
}

.booking-event-button:hover,
.booking-event-button:focus {
    background-color: #F8D768DE;
    color: currentColor;
}

.booking-event-button.loading {
    opacity: 0.8;
    pointer-events: none;
}

.booking-event-button.added {
    pointer-events: none;
}

/*.booking-event-button.added::after {
    content: "✓";
}*/

.booking-event-button + .added_to_cart {
    margin-left: 0.5rem;
}

.added_to_cart {
    position: relative;
    z-index: 1;
}

.booking-event-footer {
    text-align: center;
}

.notices-container {
    position: fixed;
    z-index: 1050;
    right: 1rem;
    bottom: 1rem;
    width: 350px;
    max-width: 100%;
}
