
/* NORDICMIX BOOKING DEPTH V2
   Samme officielle palette som forsiden.
   Kun bookingomraadet - ikke coverknapperne.
*/

#nm-unified-services {
    position:relative;
    overflow:hidden;
    background:var(--nm-brand-white)!important;
    border:1px solid var(--nm-brand-light-blue)!important;
    border-radius:24px!important;
    box-shadow:
        0 24px 55px rgba(20,50,61,.13),
        0 7px 18px rgba(20,50,61,.06)!important;
    scroll-margin-top:100px;
}

#nm-unified-services::before {
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;
    z-index:4;
    background:linear-gradient(
        90deg,
        var(--nm-brand-deep) 0%,
        var(--nm-brand-cta) 55%,
        var(--nm-brand-light-blue) 100%
    );
    pointer-events:none;
}

/* Trinmenu */
#nm-unified-services .progress-head {
    background:var(--nm-brand-light-blue)!important;
    border-color:var(--nm-brand-border)!important;
    padding:30px 20px!important;
}

#nm-unified-services .step-ind {
    border-radius:13px!important;
    min-height:66px;
    border:1px solid rgba(20,50,61,.12)!important;
    background:var(--nm-brand-white)!important;
    color:var(--nm-brand-text)!important;
    box-shadow:0 3px 10px rgba(20,50,61,.04);
    transition:box-shadow .2s ease,transform .2s ease;
}

#nm-unified-services .step-ind.active {
    background:var(--nm-brand-deep)!important;
    border-color:var(--nm-brand-deep)!important;
    color:var(--nm-brand-white)!important;
    box-shadow:0 10px 22px rgba(20,50,61,.22)!important;
}

#nm-unified-services .step-ind.active * {
    color:inherit;
}

/* Indhold */
#nm-unified-services .step-pane.active {
    background:var(--nm-brand-white)!important;
    padding:clamp(28px,3.4vw,44px)!important;
    min-width:0;
}

#nm-unified-services .nm-booking-welcome {
    margin-bottom:12px!important;
}

#nm-unified-services .nm-booking-welcome h2 {
    color:var(--nm-brand-deep)!important;
    line-height:1.2!important;
    letter-spacing:-.025em;
    margin:0!important;
}

#nm-unified-services .nm-booking-welcome p {
    color:var(--nm-brand-muted)!important;
    line-height:1.8!important;
    max-width:680px;
}

/* Servicevalg */
#nm-unified-services .step-pane[data-pane="1"] select {
    display:block!important;
    width:100%!important;
    min-height:58px!important;
    height:58px!important;
    padding:12px 17px!important;
    border:1.5px solid var(--nm-brand-light-blue)!important;
    border-radius:11px!important;
    background:var(--nm-brand-white)!important;
    color:var(--nm-brand-text)!important;
    font-size:16px!important;
    box-shadow:0 5px 15px rgba(20,50,61,.06)!important;
    cursor:pointer;
}

#nm-unified-services .step-pane[data-pane="1"] select:focus {
    outline:none!important;
    border-color:var(--nm-brand-cta)!important;
    box-shadow:0 0 0 4px rgba(46,125,50,.15)!important;
}

/* Foerste ledige tid og tilhoerende bokse */
#nm-unified-services .nm-first-slot,
#nm-unified-services .nm-first-available,
#nm-unified-services .nm-next-available,
#nm-unified-services .nm-availability-overview {
    background:var(--nm-brand-mist)!important;
    border:1px solid var(--nm-brand-light-blue)!important;
    border-radius:17px!important;
    padding:24px!important;
    box-shadow:0 12px 28px rgba(20,50,61,.07)!important;
}

/* Groenne handlingsknapper i foerste bookingtrin */
#nm-unified-services .step-pane[data-pane="1"] button {
    background:var(--nm-brand-cta)!important;
    color:var(--nm-brand-white)!important;
    border-color:var(--nm-brand-cta)!important;
    border-radius:11px!important;
    min-height:46px;
    font-weight:700!important;
    box-shadow:0 6px 15px rgba(46,125,50,.15)!important;
}

#nm-unified-services .step-pane[data-pane="1"] button:hover:not(:disabled) {
    filter:brightness(.94);
    box-shadow:0 10px 20px rgba(46,125,50,.2)!important;
}

#nm-unified-services .step-pane[data-pane="1"] button:disabled {
    opacity:.55;
    cursor:not-allowed;
}

/* Kort i andre bookingtrin */
#nm-unified-services .service-card,
#nm-unified-services .cal-card,
#nm-unified-services .slot-card {
    border:1px solid var(--nm-brand-light-blue)!important;
    border-radius:15px!important;
    box-shadow:0 7px 20px rgba(20,50,61,.05)!important;
}

#nm-unified-services button:focus-visible,
#nm-unified-services a:focus-visible {
    outline:3px solid var(--nm-brand-cta)!important;
    outline-offset:3px!important;
}

/* Mobil */
@media(max-width:700px) {
    #nm-unified-services {
        border-radius:17px!important;
    }

    #nm-unified-services .progress-head {
        padding:17px 15px!important;
    }

    #nm-unified-services .step-pane.active {
        padding:24px 17px!important;
    }

    #nm-unified-services .nm-booking-welcome {
        margin-bottom:22px!important;
    }

    #nm-unified-services .step-pane[data-pane="1"] select {
        min-height:54px!important;
        height:54px!important;
    }
}

@media(prefers-reduced-motion:reduce) {
    #nm-unified-services * {
        transition:none!important;
    }
}
