@media (min-width:640px){
 #booking-form.booking-form--card-rail [data-booking-rail-source]{display:contents!important}
 #booking-form > .booking-card-rail-shell{position:relative;grid-column:1/-1!important;grid-row:1!important;min-width:0;width:100%;margin:0!important;isolation:isolate}
 .booking-card-rail{display:flex;align-items:stretch;gap:18px;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}
 .booking-card-rail::-webkit-scrollbar{display:none}
 #booking-form .booking-card-rail > [data-booking-rail-card]{flex:0 0 var(--booking-card-width,323px)!important;width:var(--booking-card-width,323px)!important;min-width:0!important;max-width:none!important;height:412px!important;display:flex!important;flex-direction:column!important;margin:0!important;grid-column:auto!important;grid-row:auto!important;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.68);box-shadow:0 14px 24px -8px rgba(17,49,31,.24),0 4px 10px rgba(17,49,31,.10)!important}
 #booking-form .booking-card-rail :is(#booking-date-toggle,#booking-service-toggle,#booking-time-toggle,#booking-addon-toggle){display:flex!important;flex:0 0 54px!important;height:54px!important;min-height:54px!important;width:100%;margin:0 0 8px!important;padding:7px 12px!important;border:0!important;border-radius:10px!important;pointer-events:auto!important;cursor:pointer;background:rgba(255,255,255,.46);justify-content:space-between!important}
 #booking-form .booking-card-rail .booking-field-heading{display:block!important;flex:0 0 auto!important;margin:0 12px 0 0!important;font-size:14px!important;font-weight:800!important;text-transform:uppercase;color:#173923!important}
 #booking-form .booking-card-rail :is(#booking-date-toggle,#booking-service-toggle,#booking-time-toggle,#booking-addon-toggle)::before{display:none!important}
 #booking-form .booking-card-rail :is(#booking-date-label,#booking-service-label,#booking-time-label){display:block!important;min-width:0;max-width:68%;margin-left:auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px!important;font-weight:800!important;color:#173923}
 #booking-form .booking-card-rail #booking-addon-label{display:none!important}
 #booking-form .booking-card-rail :is(#booking-date-toggle,#booking-service-toggle,#booking-time-toggle,#booking-addon-toggle)>i{display:none!important}
 #booking-form .booking-card-rail :is(#booking-date-menu,#booking-service-menu,#booking-time-menu,#booking-addon-menu){display:block!important;position:static!important;flex:1 1 0!important;min-height:0!important;width:100%!important;height:350px!important;max-height:350px!important;overflow-y:auto!important;overflow-x:hidden!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;scrollbar-width:none;background:rgba(255,255,255,.34)!important;transform:none!important}
 #booking-form .booking-card-rail :is(#booking-date-menu,#booking-service-menu,#booking-time-menu,#booking-addon-menu)::-webkit-scrollbar{display:none}
 #booking-form .booking-card-rail #booking-date-menu{display:flex!important;flex-direction:column!important}
 #booking-form .booking-card-rail #booking-date-list{flex:1 1 0;min-height:0!important;max-height:none!important;overflow-y:auto!important;scrollbar-width:none}
 .booking-card-rail-scrollbar{position:absolute;left:0;bottom:-10px;width:100%;height:12px;margin:0;padding:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;z-index:1}
 .booking-card-rail-scrollbar::-webkit-slider-runnable-track{height:3px;border-radius:9px;background:rgba(23,57,35,.12)}
 .booking-card-rail-scrollbar::-webkit-slider-thumb{-webkit-appearance:none;width:var(--booking-scroll-thumb,72px);height:3px;border-radius:9px;background:#608771}
 .booking-card-rail-scrollbar::-moz-range-track{height:3px;border-radius:9px;background:rgba(23,57,35,.12)}
 .booking-card-rail-scrollbar::-moz-range-thumb{width:var(--booking-scroll-thumb,72px);height:3px;border:0;border-radius:9px;background:#608771}
 .booking-card-rail-scrollbar:focus-visible{outline:2px solid #166534;outline-offset:2px;border-radius:9px}
 .booking-card-rail-scrollbar[hidden]{display:none}
}

@media (min-width:640px){
  #booking-form .booking-card-rail{box-sizing:content-box;width:100%;padding:10px 20px 26px;margin:-10px -20px -26px}
}
@media (min-width:640px){
 #booking-form.booking-form--card-rail .booking-card-rail > [data-booking-rail-card]{box-shadow:0 14px 24px -8px rgba(17,49,31,.24),0 4px 10px rgba(17,49,31,.10)!important}
}


/* BOOKING_RAIL_RESPONSIVE_ALIGNMENT_V1
 * Neljä korttia samalla rivillä 640 px alkaen.
 * Säilyttää nykyisen vaakavierityksen.
 */
@media (min-width: 640px) {

    #booking-form.booking-form--card-rail
    .booking-card-rail {
        align-items: stretch !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    > [data-booking-rail-card] {
        height: 412px !important;
        min-height: 412px !important;
        max-height: 412px !important;
        flex-shrink: 0 !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    .booking-field-heading {
        display: block !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        white-space: nowrap !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    #booking-date-dropdown
    #booking-date-menu {
        flex: 1 1 0% !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow: hidden !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    #booking-date-list {
        flex: 1 1 0% !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    #booking-date-menu,
    #booking-form.booking-form--card-rail
    .booking-card-rail
    #booking-date-list {
        border-radius: 0 0 12px 12px !important;
    }
}


/* BOOKING_RAIL_SCROLLBAR_SPACING_V3
 * Vierityspalkille oma tila korttirivin alapuolelle.
 * Ei muutoksia korttien asetteluun.
 */
@media (min-width: 640px) {

    #booking-form.booking-form--card-rail
    > .booking-card-rail-shell {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        padding-bottom: 8px !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail {
        margin-bottom: 0 !important;
        padding-bottom: 10px !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail-scrollbar {
        position: relative !important;
        left: auto !important;
        bottom: auto !important;
        display: block;
        flex: 0 0 12px !important;
        width: 100% !important;
        height: 12px !important;
        margin: 0 !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail-scrollbar[hidden] {
        display: none !important;
    }
}


/* BOOKING_RAIL_TABLET_FOLDER_ALIGNMENT_V3 */
@media (min-width: 640px) and (width < 1024px) {
    #booking-form.booking-form--card-rail:has(#booking-visit-folder-tabs)
    .booking-card-rail
    > #booking-date-dropdown.booking-date-with-folder-tabs {
        height: 451px !important;
        min-height: 451px !important;
        max-height: 451px !important;
    }

    #booking-form.booking-form--card-rail
    .booking-card-rail
    #booking-date-dropdown
    > #booking-visit-folder-tabs {
        flex: 0 0 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        box-sizing: border-box !important;
        margin-bottom: 0 !important;
    }

    #booking-form.booking-form--card-rail:has(#booking-visit-folder-tabs)
    .booking-card-rail
    > :is(
        #booking-service-dropdown,
        #booking-time-dropdown,
        #booking-addon-dropdown
    ) {
        margin-top: 39px !important;
    }
}