/* Login, Zurück & Abschluss: kompakter als Buchungs-CTA */
.contentModal .mobileFooter:not(:has(.footerButton.prize)){
    min-height: 56px;
    gap: 9px;
}

.contentModal .mobileFooter:not(:has(.footerButton.prize)) .footerButton{
    min-height: 34px;
    height: 34px;
    line-height: 32px;
    font-size: 14px;
    font-weight: 500;
    width: auto;
    flex: 1 1 0;
    max-width: 198px;
    padding: 0 16px;
}

.contentModal .mobileFooter:not(:has(.footerButton.prize)) .footerButton.light{
    flex: 0 1 auto;
    max-width: none;
    padding: 0 18px;
}

.contentModal .mobileFooter .footerButton.light.fullWidth,
.contentModal .mobileFooter .footerButton.valid.full{
    min-height: 34px;
    height: 34px;
    line-height: 32px;
    font-size: 14px;
    font-weight: 500;
    width: auto;
    max-width: min(100%, 306px);
    flex: 0 1 auto;
    margin-inline: 0;
    padding: 0 20px;
}

.contentModal .mobileFooter:has(> .footerButton.fullWidth:only-child),
.contentModal .mobileFooter:has(> .footerButton.full:only-child){
    justify-content: flex-start;
}

@media only screen and (max-width: 549px){
    .mainContent{
        padding: clamp(11px, 4vw, 16px);
    }

    .mainContent.registrationView--button{
        padding: 0;
        display: block;
    }

    .logoContainer{
        align-items: flex-start;
        padding: 14px;
        text-align: left;
    }

    .logoContainer img{
        width: 67px;
        height: 67px;
    }

    .memberButtonContainer{
        gap: 9px;
    }

    .memberButton{
        width: 100%;
    }

    .shoppingButton{
        width: 100%;
    }

    .mainContent .offerContainer:not(.listView){
        width: 100%;
    }

    .outerCardContainer{
        width: 100%;
        max-width: 100%;
    }

    .contentModal__aligner{
        padding: 0;
    }

    .contentModal__surface{
        height: 100%;
        border-radius: 0;
        border: none;
    }

    .contentModal .mobileFooter{
        flex-wrap: wrap;
    }

    .contentModal .mobileFooter .footerButton{
        width: 100%;
    }

    .contentModal .mobileFooter:not(:has(.footerButton.prize)) .footerButton{
        width: auto;
    }

    /* Preis + Timer und Buchungs-CTA wieder in einer Zeile */
    .contentModal .mobileFooter:has(.footerButton.prize){
        flex-wrap: nowrap;
        align-items: center;
    }

    .contentModal .mobileFooter:has(.footerButton.prize) .footerButton{
        width: auto;
    }

    .contentModal .mobileFooter:has(.footerButton.prize) .footerButton.prize{
        flex: 1 1 auto;
        min-width: 0;
    }

    .contentModal .mobileFooter:has(.footerButton.prize) .footerButton:not(.prize):not(.small):not(.secondary){
        flex: 0 0 158px;
        width: 158px;
        min-width: 158px;
        max-width: 158px;
        padding: 0 12px;
    }

    .contentModal .mobileFooter:has(.footerButton.prize) .innerTwoButton{
        flex: 0 0 auto;
        width: auto;
    }

    .contentModal .mobileFooter .footerButton.light.fullWidth,
    .contentModal .mobileFooter .footerButton.valid.full{
        width: auto;
    }

    .contentModal .mobileFooter .footerButton.light:not(.fullWidth){
        width: auto;
    }

    .doubleCheckBoxContainer:not(.courseGroupTypeSelection){
        flex-direction: row;
        align-items: flex-start;
    }

    .doubleCheckBoxContainer:not(.courseGroupTypeSelection) > p{
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
    }

    .doubleCheckBoxContainer:not(.courseGroupTypeSelection) .innerDoubleContainer{
        flex: 0 0 auto;
    }

    .contentModal .registrationSummaryCard{
        border-radius: 0 0 var(--registrationRadiusLg) var(--registrationRadiusLg);
    }

    .contentModal .registrationSummaryCard .registrationSummaryImageWrap,
    .contentModal .registrationSummaryCard .registrationSummaryImageWrap img{
        border-radius: 0;
    }

    .contentModal .registrationSummaryCard .shoppingTextContainer{
        padding: 14px 14px 14px 14px;
    }

    .attendeHeaderActions{
        gap: 5px;
    }

    .contentModal .mobileShoppingCart .contactData .attendeAccordionToggle{
        gap: 7px;
        padding: 12px 0;
    }

    .attendeTitleGroup{
        gap: 5px;
    }

    .attendeIndex, .attendeStatus{
        padding-inline: 25px;
        font-size: 14px;
    }

    .attendeName{
        font-size: 14px;
    }

    .contentModal .mobileShoppingCart .contactData .attendeActionButton{
        padding-inline: 8px;
        font-size: 11px;
    }

    .attendeRemoveConfirm{
        align-items: stretch;
        flex-direction: column;
    }

    .attendeRemoveActions{
        width: 100%;
    }

    .contentModal .mobileShoppingCart .contactData .attendeRemoveActions .attendeActionButton{
        flex: 1 1 0;
    }
}

@media only screen and (min-width: 550px){
    .contentModal .mobileShoppingCart .contactData{
        padding: 9px 31px;
    }

    .contentModal .mobileFooter{
        padding-inline: 31px;
    }

    .contentModal .mobileShoppingCart .shoppingElementOne{
        margin: 22px 31px 0 31px;
        border: 1px solid var(--registrationBorder);
        border-radius: var(--registrationRadiusLg);
        box-shadow: var(--registrationShadowSm);
        overflow: hidden;
    }

    .contentModal .mobileShoppingCart .shoppingElementOne{
        border-bottom: 1px solid var(--registrationBorder);
    }

    .contentModal .registrationSummaryCard{
        margin: 23px 31px 7px 31px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(153px, 58%, 207px);
        align-items: stretch;
        border: 1px solid var(--registrationBorder);
        box-shadow: var(--registrationShadowSm);
    }


    .contentModal .mobileShoppingCart .shoppingElementOne img{
        border-radius: 0;
        box-shadow: none;
        object-fit: cover;
    }

    .contentModal .registrationSummaryCard .registrationSummaryImageWrap{
        grid-column: 2;
        grid-row: 1;
        min-height: 100%;
        border-right: none;
        border-bottom: none;
        border-left: 1px solid color-mix(in srgb, var(--registrationBorder) 70%, var(--cardColor));
        border-radius: 0 calc(var(--registrationRadiusLg) - 1px) calc(var(--registrationRadiusLg) - 1px) 0;
    }

    .contentModal .registrationSummaryCard .registrationSummaryImageWrap img{
        min-height: 100%;
        max-height: none;
        aspect-ratio: auto;
    }

    .contentModal .registrationSummaryCard .shoppingTextContainer{
        grid-column: 1;
        grid-row: 1;
        max-width: none;
        padding: 14px 16px;
    }
}

@media only screen and (min-width: 1000px){
    .outerCardContainer:hover,
    .memberCard:hover{
        box-shadow: var(--registrationShadowMd);
        transform: translateY(-2.7px);
        scale: 1;
    }

    .contentModal__surface{
        border-radius: 27px;
    }

    .contentModal.login .contentModal__surface,
    .contentModal.password .contentModal__surface{
        width: min(387px, calc(100vw - 43px));
    }
}

.errorPage{
    margin: 0;
    padding: 0;
    font-family: 'Arial', sans-serif;
    background: linear-gradient(to top, #b3e5fc, #e0f7fa);
    overflow: hidden;
    height: 100vh;
    max-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #01579b;
    text-align: center;
    position: relative;
    z-index: 1;
}

.errorPage h1 {
    font-size: 90px;
    margin: 0 0 9px 0;
    animation: float 3s ease-in-out infinite;
}

.errorPage p {
    font-size: 23px;
    margin-bottom: 27px;
}



/* Berge im Hintergrund */
.mountain {
    position: absolute;
    bottom: 0;
    width: 200%;
    height: 40%;
    background: #6da1bb;
    clip-path: polygon(0 100%, 20% 30%, 40% 100%, 60% 20%, 80% 100%, 100% 30%, 100% 100%);
    z-index: -2;
    animation: moveMountains 30s linear infinite;
}

.mountain2 {
    background: #336a83;
    height: 50%;
    animation-duration: 50s;
    clip-path: polygon(0 100%, 15% 40%, 35% 100%, 55% 25%, 75% 100%, 100% 35%, 100% 100%);
}

@keyframes moveMountains {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* Wolken */
.cloud {
    position: absolute;
    top: 45px;
    background: #fff;
    border-radius: 50%;
    width: 72px;
    height: 45px;
    box-shadow: 27px 9px 0 0 #fff, 54px 0 0 0 #fff;
    animation: moveClouds 40s linear infinite;
    opacity: 0.8;
}

.cloud:nth-child(1) { top: 72px; left: -180px; animation-duration: 60s; }
.cloud:nth-child(2) { top: 135px; left: -270px; animation-duration: 80s; }

@keyframes moveClouds {
    from { transform: translateX(0); }
    to { transform: translateX(200vw); }
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-9px); }
}


/* Schnee */
.snowflake {
    position: absolute;
    top: -9px;
    color: white;
    z-index: 5;
    animation: fall linear infinite;
}
@keyframes fall {
    to {
        transform: translateY(110vh);
    }
}

.registrationView--hut .offerContainer.hutBookingOuter{
    padding:0 4px;
}
.hutBookingOuter{
    width:100%;
    max-width:920px;
    margin:0 auto;
}
.hutBookingOuter .regNativeSelectWrap{
    position:relative;
    width:100%;
    margin-top:5px;
}
.hutBookingOuter .regNativeSelectWrap select.regNativeSelect,
.contentModal .regNativeSelectWrap select.regNativeSelect{
    width:100%;
    min-height:40px;
    line-height:20px;
    border:solid 1.4px var(--secondaryColor);
    background-color:var(--secondaryColor);
    border-radius:9px;
    padding:9px 31px 9px 11px;
    font-size:14px;
    font-weight:400;
    color:var(--writeColorParagraph);
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    cursor:pointer;
    transition:border-color 140ms ease, background-color 140ms ease;
}
.hutBookingOuter .regNativeSelectWrap select.regNativeSelect:focus,
.contentModal .regNativeSelectWrap select.regNativeSelect:focus{
    outline:none;
    border:solid 1.4px var(--highlightColor);
}
.hutBookingCalShell{
    border:1px solid var(--registrationBorder, var(--secondaryColor));
    border-radius:var(--registrationRadiusLg, 11px);
    background:var(--cardColor);
    box-shadow:var(--registrationShadowSm, 0 2px 9px rgba(0,0,0,.06));
    padding:14px 16px 16px;
}
.hutBookingCalNav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:11px;
    margin-bottom:12px;
}
.hutBookingCalNavTitle{
    margin:0;
    flex:1 1 auto;
    text-align:center;
    font-size:15px;
    font-weight:600;
    color:var(--writeColorHeader);
}
.hutBookingCalNavBtn{
    flex-shrink:0;
    width:36px;
    height:36px;
    border-radius:9px;
    border:1.4px solid var(--secondaryColor);
    background:var(--cardColor);
    color:var(--writeColorParagraph);
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:border-color 140ms ease, color 140ms ease, background-color 140ms ease;
}
.hutBookingCalNavBtn:hover:not(:disabled){
    border-color:var(--highlightColor);
    color:var(--highlightColor);
}
.hutBookingCalNavBtn:disabled{
    opacity:.4;
    cursor:not-allowed;
}
.hutBookingSelectionBar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:11px;
    flex-wrap:wrap;
    min-height:44px;
    box-sizing:border-box;
    margin-bottom:12px;
    padding:10px 12px;
    border-radius:9px;
    border:1px solid color-mix(in srgb, var(--highlightColor) 22%, var(--secondaryColor));
    background:color-mix(in srgb, var(--highlightColor) 6%, var(--cardColor));
}
.hutBookingSelectionBar--ready{
    border-color:color-mix(in srgb, var(--highlightColor) 38%, var(--secondaryColor));
    background:color-mix(in srgb, var(--highlightColor) 10%, var(--cardColor));
}
.hutBookingSelectionBarInfo{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    font-weight:500;
    color:var(--writeColorHeader);
}
.hutBookingSelectionBarInfo i{
    color:var(--highlightColor);
}
.hutBookingCalDual{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}
.hutBookingCalMonthTitle{
    font-size:14px;
    font-weight:700;
    text-align:center;
    margin:0 0 10px;
    color:var(--writeColorHeader);
}
.hutBookingCalGrid{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:4px;
}
.hutBookingCalDayName{
    font-size:11px;
    font-weight:700;
    color:var(--writeColorParagraph2);
    text-align:center;
    padding-bottom:4px;
}
.hutBookingCalDay{
    position:relative;
    min-height:42px;
    border:none;
    border-radius:9px;
    background:transparent;
    text-align:center;
    padding:6px 2px 8px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:3px;
    cursor:pointer;
    box-sizing:border-box;
    -webkit-user-select:none;
    user-select:none;
    transition:background-color 140ms ease, color 140ms ease;
}
.hutBookingCalDay--empty{
    border:none;
    background:transparent;
    pointer-events:none;
    min-height:42px;
}
.hutBookingCalDay--past{
    cursor:default;
    opacity:.45;
}
.hutBookingCalDay--past .hutBookingCalDayNum{
    color:var(--writeColorParagraph2);
}
.hutBookingCalDay--today .hutBookingCalDayNum{
    color:var(--highlightColor);
    font-weight:800;
}
.hutBookingCalShell:not(.hutBookingCalShell--selecting) .hutBookingCalDay:not(:disabled):not(.hutBookingCalDay--empty):not(.hutBookingCalDay--past):hover{
    background:var(--highlightColor);
}
.hutBookingCalShell:not(.hutBookingCalShell--selecting) .hutBookingCalDay:not(:disabled):not(.hutBookingCalDay--empty):not(.hutBookingCalDay--past):hover .hutBookingCalDayNum{
    color:var(--buttonWriteColor);
    font-weight:700;
}
.hutBookingCalShell:not(.hutBookingCalShell--selecting) .hutBookingCalDay:not(:disabled):not(.hutBookingCalDay--empty):not(.hutBookingCalDay--past):hover .hutBookingCalDayIndicator{
    background:var(--buttonWriteColor);
}
.hutBookingCalDay--rangeStart,
.hutBookingCalDay--rangeEnd{
    background:var(--highlightColor);
}
.hutBookingCalDay--rangeStart .hutBookingCalDayNum,
.hutBookingCalDay--rangeEnd .hutBookingCalDayNum{
    color:var(--buttonWriteColor);
    font-weight:700;
}
.hutBookingCalDay--rangeBetween{
    background:color-mix(in srgb, var(--highlightColor) 16%, var(--cardColor));
    border-radius:0;
}
.hutBookingCalDay--rangeBetween .hutBookingCalDayNum{
    color:var(--writeColorHeader);
    font-weight:600;
}
.hutBookingCalDay--rangeStart .hutBookingCalDayIndicator,
.hutBookingCalDay--rangeEnd .hutBookingCalDayIndicator{
    background:var(--buttonWriteColor);
}
.hutBookingCalDay--rangeStart{
    border-radius:9px 0 0 9px;
}
.hutBookingCalDay--rangeEnd{
    border-radius:0 9px 9px 0;
}
.hutBookingCalDay--rangeStart.hutBookingCalDay--rangeEnd{
    border-radius:9px;
}
.hutBookingCalDayNum{
    font-size:14px;
    font-weight:600;
    line-height:1.2;
    color:var(--writeColorHeader);
}
.hutBookingCalDayIndicator{
    display:block;
    width:12px;
    height:12px;
    border-radius:50%;
    flex-shrink:0;
}
.hutBookingCalDayIndicator--available{
    background:color-mix(in srgb, var(--highlightColor) 72%, var(--cardColor));
}
.hutBookingCalDayIndicator--partial{
    background:color-mix(in srgb, var(--highlightColor) 45%, var(--cardColor));
}
.hutBookingCalDayIndicator--booked{
    background:color-mix(in srgb, var(--deniedColor) 45%, var(--writeColorParagraph2));
}
.hutBookingLegend{
    display:flex;
    flex-wrap:wrap;
    gap:14px 18px;
    margin-top:14px;
    padding-top:12px;
    border-top:1px solid color-mix(in srgb, var(--registrationBorder, var(--secondaryColor)) 70%, var(--cardColor));
}
.hutBookingLegendItem{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:12px;
    color:var(--writeColorParagraph);
}
.hutBookingCalFooter{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-top:14px;
}
.hutBookingCalBookBtn{
    min-width:140px;
    flex:0 0 auto;
}
.bookingOfferExternalBookHint{
    margin:0;
    min-width:0;
    font-size:13px;
    line-height:1.35;
    color:var(--deniedColor);
}
.hutBookingAvailabilityInfo{
    margin:5px 0 0;
    font-size:13px;
    color:var(--writeColorParagraph);
}
.contentModal .mobileShoppingCart .contactData .hutUnitLine.inputContainerDouble{
    flex-wrap:nowrap;
    align-items:flex-end;
    gap:6px;
    margin-top:5px;
}
.contentModal .mobileShoppingCart .contactData .hutUnitLine.inputContainerDouble .inputContainer:nth-child(1){
    width:auto;
    flex:0 0 32%;
    max-width:32%;
}
.contentModal .mobileShoppingCart .contactData .hutUnitLine.inputContainerDouble .inputContainer:nth-child(2){
    width:auto;
    flex:1 1 0;
    min-width:0;
}
.contentModal .mobileShoppingCart .contactData button.hutUnitLineRemove{
    flex:0 0 auto;
    align-self:flex-end;
    width:30px;
    min-width:30px;
    max-width:30px;
    height:40px;
    min-height:40px;
    margin:0 0 12px;
    padding:0;
    border:none;
    border-radius:6px;
    background:var(--secondaryColor);
    box-shadow:none;
    color:var(--writeColorParagraph2);
    cursor:pointer;
    font-size:13px;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.contentModal .mobileShoppingCart .contactData button.hutUnitLineRemove:hover{
    color:var(--highlightColor);
    background:color-mix(in srgb, var(--highlightColor) 8%, transparent);
    border:none;
    box-shadow:none;
}
.hutUnitLine.error .hutExtUnitQty,
.hutUnitLine.error select.regNativeSelect{
    border:solid 1.4px var(--highlightColor);
}
.contentModal .regNativeSelectWrap{
    position:relative;
    width:100%;
}
.contentModal .regNativeSelectChevron{
    position:absolute;
    right:11px;
    top:50%;
    transform:translateY(-50%);
    pointer-events:none;
    font-size:11px;
    color:var(--writeColorParagraph2);
}
.footerButton.disabled,
.footerButton:disabled{
    opacity:.5;
    pointer-events:none;
}

.registrationInfoToast{
    position:fixed;
    top:max(11px, env(safe-area-inset-top));
    left:50%;
    transform:translateX(-50%);
    z-index:2147483647;
    width:min(378px, calc(100vw - 22px));
    box-sizing:border-box;
    padding:11px 13px;
    border-radius:11px;
    background:var(--cardColor, #fff);
    border:solid 1.4px var(--secondaryColor);
    box-shadow:0 7px 25px rgba(0,0,0,.12);
    animation:registrationToastIn 220ms ease forwards;
}
.registrationInfoToast--ok{
    border-color:color-mix(in srgb, var(--highlightColor) 35%, var(--secondaryColor));
}
.registrationInfoToast__inner{
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    gap:9px;
}
.registrationInfoToast__icon{
    flex-shrink:0;
    margin-top:1.8px;
    font-size:16px;
    color:var(--highlightColor);
}
.registrationInfoToast--ok .registrationInfoToast__icon{
    color:var(--highlightColor);
}
.registrationInfoToast__msgblock{
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}
.registrationInfoToast__title{
    font-weight:700;
    font-size:14px;
    color:var(--writeColorHeader);
}
.registrationInfoToast__text{
    font-size:13px;
    line-height:1.35;
    color:var(--writeColorParagraph);
}
.registrationInfoToast__close{
    flex-shrink:0;
    border:none;
    background:transparent;
    color:var(--writeColorParagraph2);
    cursor:pointer;
    padding:4px;
    line-height:1;
    border-radius:7px;
}
.registrationInfoToast__close:hover{
    color:var(--writeColorHeader);
    background:color-mix(in srgb, var(--secondaryColor) 80%, transparent);
}
@keyframes registrationToastIn{
    from{opacity:0;transform:translateX(-50%) translateY(-7.2px);}
    to{opacity:1;transform:translateX(-50%) translateY(0);}
}

@media only screen and (max-width: 767px){
    .hutBookingCalDual{
        grid-template-columns:1fr;
        gap:16px;
    }
    .hutBookingCalShell{
        padding:12px 11px 14px;
    }
}
