@keyframes pulse {
    0%, 100% {
        background-color: var(--e-global-color-c344936);
    }
    50% {
        background-color: var(--e-global-color-3c16749)
    }
}

/* Body-Scrolling verhindern */
body.hdt-no-scroll {
    overflow: hidden;
}

/* Modal-Overlay */
.hdt-booking-modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

/* Modal-Wrapper */
.hdt-booking-modal__wrapper {
    background: #fff;
    width: calc(100% - 40px);
    max-width: 1920px;
    max-height: calc(100dvh - 40px);
    padding: 20px;
    position: relative;
    overflow-y: auto;
}

/* Modal-Close Button */
.hdt-booking-modal__close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 32px;
    background: none;
    border: none;
    cursor: pointer;
}

.hdt-booking {
    display: flex;
    flex-direction: column;
}

.hdt-booking * {
    box-sizing: border-box;
    font-size: var(--e-global-typography-53ca5e8-font-size);
    line-height: var(--e-global-typography-53ca5e8-line-height);
    color: var(--e-global-color-8a64ffb);
}

.hdt-booking p,
.hdt-booking h1,
.hdt-booking h2,
.hdt-booking h3,
.hdt-booking h4,
.hdt-booking h5,
.hdt-booking h6 {
    margin: 0;
}

.hdt-booking-header {
    display: flex;
    gap: 30px;
    flex-direction: column;
    margin-top: 20px;
}

.hdt-booking-header__label {
    display: block;
    color: var(--e-global-color-1de3f2b);
    font-size: var(--e-global-typography-abb6706-font-size);
    font-weight: var(--e-global-typography-abb6706-font-weight);
    line-height: var(--e-global-typography-abb6706-line-height);
}

.hdt-booking-header__label--empty {
    display: none;
}
/*
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}*/

.hdt-booking-form {
    margin-top: 40px;
}

.hdt-booking-attendees, .hdt-booking-attendee-item {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.hdt-booking-attendees .hdt-booking-attendee-item:first-child .hdt-booking-attendee-item__header {
    flex-direction: column;
    align-items: start;
}

.hdt-booking-attendee-item {
    padding: 20px;
    background-color: var(--e-global-color-966b3ca);
}

.hdt-booking-attendee-item--removing {
    opacity: 0; /* Fades out */
    transform: translateY(-20px); /* Slides up */
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

.hdt-booking-attendee-item__header {
    display: flex;
    gap: 20px;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.hdt-booking-attendee-item__title {
    font-size: var(--e-global-typography-7455e76-font-size);
    font-weight: var(--e-global-typography-7455e76-font-weight);
    line-height: var(--e-global-typography-7455e76-line-height);
    color: var(--e-global-color-5a698b8);
}

.hdt-booking-attendee-item__actions {
    position: relative;
}

.hdt-booking-attendee-item__user-data {
    display: none;
}

.hdt-booking-attendee-item__switch {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    cursor: pointer;
    gap: 40px;
}

.hdt-booking-attendee-item__switch input[type=checkbox] {
    display: none;
}

.hdt-booking-attendee-item__switch-toggle {
    width: 44px;
    height: 24px;
    background-color: var(--e-global-color-e8414c9);
    border-radius: 24px;
    position: relative;
    transition: background-color .3s ease;
    min-width: 44px;
}

.hdt-booking-attendee-item__switch-toggle::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    height: 20px;
    width: 20px;
    background: var(--e-global-color-3c16749);
    border-radius: 50%;
    transform: translateX(2px);
    transition: transform .3s;
}

.hdt-booking-attendee-item__switch-toggle--loading::after {
    animation: pulse .75s infinite;
}

.hdt-booking-attendee-item__switch input[type=checkbox]:checked + .hdt-booking-attendee-item__switch-toggle {
    background-color: var(--e-global-color-accent);
}

.hdt-booking-attendee-item__switch input[type=checkbox]:checked + .hdt-booking-attendee-item__switch-toggle::after {
    transform: translateX(22px);
}

.hdt-booking-attendee-item__actions button {
    display: flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    margin: 0;
    line-height: 1;
    background: none;
}

.hdt-booking-attendee-item__actions button path {
    fill: var(--e-global-color-5a698b8);
}

.hdt-booking-attendee-item__actions button:hover,
.hdt-booking-attendee-item__actions button:focus,
button.hdt-booking-attendee-item__action-remove--active {
    background: var(--e-global-color-5a698b8);
}

.hdt-booking-attendee-item__actions button:hover path,
.hdt-booking-attendee-item__actions button:focus path,
button.hdt-booking-attendee-item__action-remove--active path {
    fill: white;
}

button.hdt-booking-attendee-item__action-remove {
    position: relative;
    z-index: 10;
}

button.hdt-booking-attendee-item__action-confirm,
button.hdt-booking-attendee-item__action-cancel {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 5;
    cursor: pointer;
    transition: opacity 0.15s ease-out, right 0.15s ease-out, top 0.15s ease-out;
    opacity: 0;
}

button.hdt-booking-attendee-item__action-confirm {
    background-color: var(--e-global-color-1de3f2b);
}

button.hdt-booking-attendee-item__action-cancel {
    background-color: var(--e-global-color-9b9f1a7);
}

button.hdt-booking-attendee-item__action-confirm--active,
button.hdt-booking-attendee-item__action-cancel--active {
    opacity: 1;
}

button.hdt-booking-attendee-item__action-confirm--active path,
button.hdt-booking-attendee-item__action-cancel--active path {
    fill: white;
}

button.hdt-booking-attendee-item__action-confirm--active {
    right: 0;
    top: 100%;
}

button.hdt-booking-attendee-item__action-cancel--active {
    right: 100%;
    top: 0;
}

.hdt-booking-attendee-item__body {
    display: flex;
    gap: 20px;
    flex-direction: column;
    flex: 1;
}

.hdt-booking-attendee-item__fields {
    display: flex;
    gap: 20px;
    flex-direction: column;
    flex: 1;
}

.hdt-booking-attendee-item__group {
    display: flex;
    gap: 20px;
    flex-direction: column;
    flex: 1;
}

.hdt-booking-attendee-item__field {
    flex: 1;
}

.hdt-booking-attendee-item__additional-fields {
    display: none;
    gap: 20px;
    flex-direction: column;
}

.hdt-booking-attendee-item__note {
    font-family: var(--e-global-typography-d812632-font-family), sans-serif;
    font-size: var(--e-global-typography-d812632-font-size);
    font-weight: var(--e-global-typography-d812632-font-weight);
    line-height: var(--e-global-typography-d812632-line-height);
}

.hdt-booking-attendee-item__field-input input[type=date] {
    padding: 9px 16px 9px 16px !important;
}

.hdt-booking-attendee-item__options {
    display: flex;
    gap: 20px;
    flex-direction: column;
    align-items: start;
    margin-top: 36px;
}

.hdt-booking-attendee-item__option {
    display: flex;
    gap: 0;
    flex-direction: row;
    align-items: start;
    width: 100%;
}

.hdt-booking-attendee-item__option input[type=radio] {
    appearance: none;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.hdt-booking-attendee-item__option-label {
    display: flex;
    gap: 5px;
    flex-direction: column;
    flex-grow: 1;
    width: 100%;
    cursor: pointer;
    position: relative;
    padding-left: 34px;
}

.hdt-booking-attendee-item__option-label::before {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 24px;
    border: 1px solid var(--e-global-color-8a64ffb);
    background-color: white;
    border-radius: 50%;
    z-index: 3;
}

.hdt-booking-attendee-item__option-label:hover::before {
    background-color: var(--e-global-color-966b3ca);
}

.hdt-booking-attendee-item__option input[type=radio]:checked + .hdt-booking-attendee-item__option-label::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 6px;
    width: 12px;
    height: 12px;
    background-color: var(--e-global-color-8a64ffb);
    border-radius: 50%;
    z-index: 4;
}

.hdt-booking-attendee-item__option-price {
    display: flex;
    gap: 0;
    flex-direction: row;
    align-items: center;
}

.hdt-booking-attendee-item__option-price:not(.hdt-booking-attendee-item__option-price--reduced) * {
    position: relative;
    font-family: var(--e-global-typography-53ca5e8-font-family), sans-serif;
    font-size: var(--e-global-typography-53ca5e8-font-size);
    line-height: var(--e-global-typography-53ca5e8-line-height);
    color: var(--e-global-color-8a64ffb);
    background-color: var(--e-global-color-966b3ca);
    z-index: 2;
}

.hdt-booking-attendee-item__option-price:not(.hdt-booking-attendee-item__option-price--reduced) {
    justify-content: space-between;
    position: relative;
}

.hdt-booking-attendee-item__option-price:not(.hdt-booking-attendee-item__option-price--reduced)::after {
    display: block;
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: 7px;
    left: 0;
    border-bottom: 1px dotted var(--e-global-color-8a64ffb);
    content: "";
    z-index: 1;
}

.hdt-booking-attendee-item__option-price--reduced {
    gap: 5px;
}

.hdt-booking-attendee-item__option-price--reduced * {
    font-family: var(--e-global-typography-aa06487-font-family), sans-serif;
    font-size: var(--e-global-typography-aa06487-font-size);
    line-height: var(--e-global-typography-aa06487-line-height);
    color: var(--e-global-color-28838c0);
}

.hdt-booking-attendee-item__option-price--reduced .hdt-booking-attendee-item__option-title {
    text-decoration: underline;
}

.hdt-booking-attendee-item__option-disabled {
    font-family: var(--e-global-typography-abb6706-font-family), sans-serif;
    font-size: var(--e-global-typography-abb6706-font-size);
    font-weight: var(--e-global-typography-abb6706-font-weight);
    line-height: var(--e-global-typography-abb6706-line-height);
}

.hdt-booking-attendee-item__option-label--note .hdt-booking-attendee-item__option-price:not(.hdt-booking-attendee-item__option-price--reduced) .hdt-booking-attendee-item__option-title {
    text-decoration-line: underline;
    text-decoration-color: #F2B600;
    text-decoration-style: double;
}

.hdt-booking-footer {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 20px;
    align-content: flex-start;
    justify-content: space-between;
}

.hdt-booking-footer__column {
    display: flex;
    gap: 20px;
    flex-direction: column;
    align-items: center;
}

.hdt-booking-footer__button {
    display: flex;
    gap: 10px;
    padding: 32px 16px;
    background-color: var(--e-global-color-accent);
    align-items: center;
    font-family: var(--e-global-typography-1dc0f67-font-family), sans-serif;
    font-size: var(--e-global-typography-1dc0f67-font-size);
    font-weight: var(--e-global-typography-1dc0f67-font-weight);
    line-height: var(--e-global-typography-1dc0f67-line-height);
    justify-content: center;
}

.hdt-booking-footer__button--ghost {
    background-color: transparent !important;
    padding: 16px 0 !important;
}

.hdt-booking-footer__button--ghost:hover,
.hdt-booking-footer__button--ghost:focus {
    background-color: transparent !important;
}

.hdt-booking-footer__button--ghost:hover .hdt-booking-footer__button-text,
.hdt-booking-footer__button--ghost:focus .hdt-booking-footer__button-text {
    color: var(--e-global-color-1e19c7f);
}

.hdt-booking-footer__button--ghost:hover path,
.hdt-booking-footer__button--ghost:focus path {
    fill: var(--e-global-color-1e19c7f);
}

.hdt-booking-footer__button-text {
    color: var(--e-global-color-bc26fb6);
    font-family: var(--e-global-typography-1dc0f67-font-family), sans-serif;
    font-size: var(--e-global-typography-1dc0f67-font-size);
    font-weight: var(--e-global-typography-1dc0f67-font-weight);
    line-height: var(--e-global-typography-1dc0f67-line-height);
}

.hdt-booking-footer__button path {
    fill: var(--e-global-color-bc26fb6);
}

.hdt-booking-footer__action--submit {
    width: 100%;
}

.hdt-booking-footer__summary {
    font-family: var(--e-global-typography-b0e3ff3-font-family), sans-serif;
    font-size: var(--e-global-typography-b0e3ff3-font-size);
    font-weight: var(--e-global-typography-b0e3ff3-font-weight);
    line-height: var(--e-global-typography-b0e3ff3-line-height);
    width: calc(100% - 40px);
    display: flex;
    gap: 0;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.hdt-booking-footer__summary * {
    position: relative;
    background-color: var(--e-global-color-3c16749);
    z-index: 2;
}

.hdt-booking-footer__summary::after {
    display: block;
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: 7px;
    left: 0;
    border-bottom: 1px dotted var(--e-global-color-8a64ffb);
    content: "";
    z-index: 1;
}

.hdt-booking-footer__summary > *:first-child {
    padding-right: 10px;
}

.hdt-booking-footer__summary > *:last-child {
    padding-left: 10px;
}

@media (min-width: 769px) {
    .hdt-booking-modal__wrapper {
        width: calc(100% - 60px);
        max-height: calc(100dvh - 60px);
        padding: 30px;
    }

    .hdt-booking-modal__close {
        top: 30px;
        right: 30px;
    }

    .hdt-booking-header {
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 0;
    }

    .hdt-booking-header__column {
        width: calc(25% - 15px);
        flex-grow: 1;
    }

    .hdt-booking-header__column--expanded {
        width: calc(50% - 30px);
        flex-grow: 2;
    }

    .hdt-booking-header__column--expanded:first-of-type {
        width: 100%;
    }

    .hdt-booking-header__content--no-break {
        white-space: nowrap;
    }

    .hdt-booking-attendee-item {
        padding: 40px;
    }

    .hdt-booking-attendees .hdt-booking-attendee-item:first-child .hdt-booking-attendee-item__header {
        flex-direction: row;
        align-items: center;
    }

    .hdt-booking-attendee-item__group {
        flex-direction: row;
    }

    .hdt-booking-footer__summary {
        width: calc(100% - 80px);
    }
}

@media (min-width: 1025px) {
    .hdt-booking-header {
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .hdt-booking-header__label--empty {
        display: block;
    }

    .hdt-booking-header__column {
        width: calc(15% - 15px);
    }

    .hdt-booking-header__column--expanded,
    .hdt-booking-header__column--expanded:first-of-type {
        width: calc(35% - 30px);
    }

    .hdt-booking-attendee-item__body {
        flex-direction: row;
        gap: 60px;
    }

    .hdt-booking-attendee-item__fields {
        width: calc(66.67% - 30px);
    }

    .hdt-booking-attendee-item__options {
        width: calc(33.33% - 30px);
    }

    .hdt-booking-footer {
        flex-direction: row;
    }

    .hdt-booking-footer .hdt-booking-footer__column:last-child {
        width: calc(33.33%);
    }

    .hdt-booking-footer__summary {
        padding: 16px 0;
        width: calc(100% - 30px);
    }

    .hdt-booking-footer__summary::after {
        bottom: 23px;
    }
}