.elementor-kit-7{--e-global-color-primary:#F3EBD8;--e-global-color-secondary:#D4AF37;--e-global-color-text:#FFFFFF;--e-global-color-accent:#FF2A2A;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:900;--e-global-typography-secondary-font-family:"Roboto Mono";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:#0F0F0F;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* --- FIX: TIME SLOT DROPDOWN VISIBILITY --- */

/* 1. Target the Main Input (Collapsed) - MATCH YOUR SITE THEME */
/* This makes the box black and the selected text white */
#time_slot, 
.select2-container--default .select2-selection--single {
    background-color: #000000 !important; /* Black Box */
    color: #ffffff !important;           /* White Text */
    border: 1px solid #333 !important;   /* Subtle Border */
}

/* Force the text inside the Select2 box to be white */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ffffff !important;
}

/* 2. Target the Dropdown List (Expanded) - HIGH CONTRAST */
/* This pops open as white with black text so it's easy to read */
#time_slot option,
.select2-dropdown, 
.select2-container--default .select2-results__option {
    background-color: #ffffff !important; /* White Background */
    color: #000000 !important;           /* Black Text */
}

/* 3. Hover State in the List */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option:hover {
    background-color: #D4AF37 !important; /* Gold Highlight */
    color: #000000 !important;
}

/* 4. Fix arrow color to be visible on black */
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #fff transparent transparent transparent !important;
}

/* --- FIX: DELIVERY DATE BOX STYLING --- */

/* Target the specific Date Input Field */
input#e_deliverydate, 
.orddd-lite-checkout-date-field input {
    background-color: #000000 !important;   /* Black Background */
    color: #ffffff !important;             /* White Text */
    border: 1px solid #555555 !important;  /* Visible Grey Border */
    padding: 12px 15px !important;         /* Space inside the box */
    border-radius: 0px !important;         /* Tactical Sharp Corners */
    width: 100% !important;                /* Full Width */
    min-height: 45px !important;           /* Height to match other fields */
}

/* Change Border Color on Hover/Focus (Active State) */
input#e_deliverydate:focus,
.orddd-lite-checkout-date-field input:focus {
    border-color: #D4AF37 !important;      /* Gold Border when clicked */
    outline: none !important;
}

/* Fix Placeholder Text Color (if it looks invisible) */
input#e_deliverydate::placeholder {
    color: #888888 !important;             /* Light Grey Placeholder */
    opacity: 1 !important;
}/* End custom CSS */