/* =========================================================
   DAMIAN PHILPOTT — STEP 4 DATE/TIME GLASS CLEANUP V1
   ---------------------------------------------------------
   Desktop Date & Time step only.

   Changes:
   - removes the small empty-state calendar icon from Time panel
   - removes the hard black seam between calendar and time panels
   - replaces panel paint with the approved flat satin glass family
   - keeps all calendar/time functionality unchanged
   ========================================================= */

@media screen and (min-width: 1001px) {

    /* Whole two-panel area: let the global glass show through
       instead of painting the centre seam solid black. */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_date_time_area {
        background: rgba(11,11,11,.10) !important;
        background-color: rgba(11,11,11,.10) !important;
        background-image: none !important;

        border: 0 !important;
        box-shadow: none !important;

        -webkit-backdrop-filter: blur(14px) saturate(102%) !important;
        backdrop-filter: blur(14px) saturate(102%) !important;
    }

    /* LEFT — Calendar panel */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_calendar_div {
        background: rgba(8,8,8,.34) !important;
        background-image: none !important;

        border: 1px solid rgba(255,255,255,.09) !important;
        border-right-color: rgba(255,255,255,.045) !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018) !important;

        -webkit-backdrop-filter: blur(14px) saturate(102%) !important;
        backdrop-filter: blur(14px) saturate(102%) !important;
    }

    /* RIGHT — Time panel */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_time_div {
        background: rgba(8,8,8,.34) !important;
        background-image: none !important;

        border: 1px solid rgba(255,255,255,.09) !important;
        border-left-color: rgba(255,255,255,.045) !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018) !important;

        -webkit-backdrop-filter: blur(14px) saturate(102%) !important;
        backdrop-filter: blur(14px) saturate(102%) !important;
    }

    /* Header strips: same glass family rather than solid blocks. */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_calendar_head,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_head {
        background: rgba(10,10,10,.24) !important;
        background-image: none !important;

        border-bottom: 1px solid rgba(255,255,255,.06) !important;

        box-shadow: none !important;
    }

    /* Panel interiors */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] #booknetic_calendar_area,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] .booknetic_calendar,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] .booknetic_calendar_rows,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] .booknetic_week_names,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] .booknetic_times,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"] .booknetic_times_list {
        background: rgba(8,8,8,.12) !important;
        background-image: none !important;
        box-shadow: none !important;
    }

    /* Instruction row in the Time panel */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_title {
        background: rgba(8,8,8,.12) !important;
        border-bottom: 1px solid rgba(255,255,255,.06) !important;
    }

    /* -----------------------------------------------------
       EMPTY TIME-PANEL CALENDAR ICON
       Booknetic can render the empty-state artwork as an img,
       svg, icon node or pseudo-element depending on version.
       Hide only artwork inside the empty Time content area.
       ----------------------------------------------------- */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_list > img,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_list > svg,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_list > i,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times > img,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times > svg,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times > i {
        display: none !important;
    }

    /* If the empty-state icon is drawn with a pseudo-element. */
    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_list::before,

    body:has(#booknetic_theme_8)
    .wp-block-booknetic-booking
    #booknetic_theme_8 [data-step-id="date_time"]
    .booknetic_times_list::after {
        background-image: none !important;
    }
}