/*
Theme Name: Box Interiors
Theme URI: https://boxinteriors.gr
Description: Custom Hello WooCommerce Child Theme for Box Interiors. Designed by: Saint Of Athens & Developed By: EERIEE.COM
Template: hello-elementor
Author: Panagiota Langas <panagiota@eeriee.com>
@see https://github.com/plangas
Version: 2.6.1
Text Domain: box-interiors
*/

/* Core styles are in assets/scss/ and compiled to assets/css/main.min.css */

@font-face {
    font-family: "AeonikPro";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("/wp-content/uploads/2024/12/aeonikpro-light.woff2") format("woff2"),
         url("/wp-content/uploads/2024/12/aeonikpro-light.woff") format("woff");
}

@font-face {
    font-family: "AeonikPro";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/wp-content/uploads/2024/12/AeonikPro-Regular_2.woff") format("woff");
}

@font-face {
    font-family: "AeonikPro";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("/wp-content/uploads/2024/12/aeonikpro-medium.woff2") format("woff2"),
         url("/wp-content/uploads/2024/12/aeonikpro-medium.woff") format("woff");
}

/* =========================================
   0. CSS VARIABLES (REM & CLAMP)
   ========================================= */
:root {
    /* --- Typography --- */
    /* FIX: Fallback placed INSIDE the parenthesis */
    --box-font-primary: var(--e-global-typography-primary-font-family, "AeonikPro", sans-serif);

    /* Title: Min 20px (1.25rem) | Preferred 5vw | Max 40px (2.5rem) */
    --box-font-size-title: clamp(1.25rem, 4vw + 1rem, 2.5rem);

    /* Description: Min 18px (1rem) | Max 20px (1.25rem) */
    --box-font-size-desc: clamp(1.125rem, 2vw, 1.25rem);

    /* Price: Fixed 20px (1.25rem) */
    --box-font-size-price: 1.25rem;

    /* UI (Buttons, Inputs, Swatch Text): Standard 16px (1rem) */
    --box-font-size-ui: 1rem;

    /* Meta/Availability: 14px (0.875rem) */
    --box-font-size-meta: 0.875rem;

    /* Labels (Upholstery/Color): 11px (0.6875rem) */
    --box-font-size-label: 0.6875rem;

    /* --- Colors --- */
    --box-color-black: #000000;
    --box-color-white: #ffffff;
    --box-color-grey: #F4F4F4;
    --box-color-text-mute: #666666;
    --box-border-color: #E5E5E5;

    /* --- Dimensions (Converted to REM) --- */
    --box-btn-height: 2.8125rem;
    --box-swatch-width: 5rem;
    --box-swatch-height: 2.5rem;
    --box-ui-element-width: 11.25rem;

    --qvsfw-variation-common-border-color: var(--box-color-text-mute);
}
/* --- GLOBAL OVERRIDES --- */

/* 1. Kill the sticky fuchsia background on Click/Focus/Active states */
.box-trigger-quote:focus, 
.box-trigger-quote:focus-visible, 
.box-trigger-quote:active,
.box-wishlist-sidebar .close-wishlist,
.box-cart-header .close-cart,
a:focus, 
a:active, 
button:focus {
    background-color: transparent !important;
    background: none !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent !important; /* Fix for mobile tap */
        border:none!important;
}
.box-wishlist-sidebar .close-wishlist,
.box-cart-header .close-cart,
a:hover {color:#000000;}

/* 2. Specific fix for Hello Elementor/WooCommerce button overrides */
.woocommerce button.button:focus, 
.woocommerce a.button:focus,
.box-card-info button:focus,
.elementor-widget-woocommerce-cart .woocommerce a:not(.add_to_cart_button):not(.restore-item):not(.wc-backward):not(.wc-forward):hover {    
    background-color: #fff !important;
    color: #000 !important;

}

/* Reusing box theme's black button style */

.box-auth-actions .box-btn-black,
.box-form-actions .box-btn-black,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button,
.elementor-widget-woocommerce-cart .woocommerce button.button:disabled, .elementor-widget-woocommerce-cart .woocommerce button.button:disabled[disabled] {
    display: inline-block;
	width:170px;
    background-color: #000 !important;
    font-family:  var(--e-global-typography-primary-font-family), "AeonikPro", Sans-serif;
    color: #fff!important;
    padding: 10px 30px!important;
    text-decoration: none;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: opacity 0.3s;
    border:none;
    border-radius: 0;
}
.elementor-widget-woocommerce-cart .woocommerce .product-name a {background-color:transparent!important;}


.p-actions .box-trigger-quote:hover,
.p-actions .box-trigger-quote button:focus {
    background-color:transparent;
    color: #000 !important;
}
.box-btn-black:hover {background-color:#000000!important; color:#fff!important;}
.p-actions .box-trigger-quote {color:#000!important; background-color: transparent!important;border:none;}
.p-actions [type=button]:focus:not(:focus-visible) {background-color:transparent!important;text-decoration: underline;}
/**
 * Shop Hours Component Styles
 * 
 */

/* Title Styling */
.shop-hours-title {
    font-size: 50px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

/* Table Reset and Layout */
.shop-hours-table {
    width: 100%;
    max-width: 300px;
    border-collapse: collapse;
    background: transparent;
    border: none;
}

/* Ensure all internal elements inherit transparency */
.shop-hours-table tbody,
.shop-hours-table tr {
    background: transparent;
}

/* Consistent Cell Padding and Alignment */
.shop-hours-table td {
    border: none;
    padding: 5px 30px 0 0 ;
    background: transparent;
    vertical-align: top;
}

/* Specific Day Column styling if needed */
.shop-hours-table .day {
    font-weight: 600; /* Optional: Makes days slightly bolder for UX */
    width: 50px;      /* Set a fixed width for the day label */
    font-size:22px;
    margin-right:10px;

}

/* Hours Column Alignment */
.shop-hours-table .hours {
    text-align: left;
    font-size:22px;
}

.input:-internal-autofill-selected {background:none;}

/* --- 1. RESET & GLOBAL HIDES --- */

.woocommerce-error, 
.woocommerce-message,
#payment #place_order,
#payment .place-order,
#payment .woocommerce-terms-and-conditions-wrapper,
.woocommerce-shipping-fields,
.woocommerce-additional-fields h3 {
    display: none !important;
}

/* --- 1. THE ARCHITECTURAL GRID (1920px Optimized) --- */
.woocommerce-checkout {
    max-width: 100vw !important; /* Proper breathing room on 1920px */
    margin: 0 auto !important;
    padding: 0!important;
}

/* Coupon Link Styling */
.woocommerce-form-coupon-toggle .showcoupon {
   font-family: var(--e-global-typography-primary-font-family), Sans-serif!important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    text-decoration: none !important; /* Clean text */
    color: #000 !important;
    letter-spacing: 0.5px;
}
.woocommerce-form-coupon-toggle .showcoupon:hover {
    text-decoration: underline !important;
}

.woocommerce-button{text-align:start;}
	
/* --- MINIMALIST NOTICE OVERLAY --- */
/* Instead of pushing content, we make notices act like a subtle toast */

.woocommerce-notices-wrapper {
    position: fixed;
    top: 120px; /* Accounts for your HeaderControls height */
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    width: auto;
    min-width: 320px;
    max-width: 90vw;
    pointer-events: none; /* UI interactions pass through */
}

.woocommerce-error, 
.woocommerce-info {
    background: #000 !important; /* Strict Brand Black */
    color: #fff !important;
    border: none !important;
    padding: 18px 30px !important;
    font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-size: 13px !important;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    margin-bottom: 10px;
}

/* Hide standard WooCommerce SVG icons to maintain minimalism */
.woocommerce-error::before, 
.woocommerce-info::before {
    display: none !important;
}

/* Hide the "View Cart" button inside the notice (redundant with our side-cart) */
.woocommerce-message .button.wc-forward {
    display: none !important;
}
.woocommerce div.product form.cart .variations select {display:none;}
.woocommerce .woocommerce-breadcrumb {padding:0; text-transform: uppercase; margin:0;}
.woocommerce img, .woocommerce-page img {max-height:85vh!important;}

.woocommerce-info {box-shadow:none;}
.elementor-widget-woocommerce-cart .woocommerce table.cart img {height:100px;width:100px;}
.elementor-widget-woocommerce-cart .woocommerce table.cart td.product-thumbnail {padding:30px 0 0 0!important;}

.cart td,
.woocommerce-MyAccount-content-wrapper {font-size:1rem!important;}
.elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce-Address address, .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce-Addresses address{
    padding: 45px 0 30px 0;
}
.elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce-Address .edit, .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce-Addresses .edi {margin-inline-start: auto;}

/* --- this is for the stripe card container -remove ugly border man */
fieldset {border:none;} 

/* --- THE "LABEL & LINE" INPUT STYLE --- */

.woocommerce-checkout #payment, .woocommerce-checkout #payment div.payment_box  {background-color:#f2f2f2;}
.woocommerce-checkout #payment ul.payment_methods li img {display:none;}

/* Labels: Small, Bold, Uppercase, No Placeholder required */
.woocommerce form .form-row label {
    font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #000 !important;
}


/* Inputs: Underline Only */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.select2-container--default .select2-selection--single {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #E0E0E0 !important;
    border-radius: 0 !important;
    padding: 8px 0 !important;
    font-size: 16px !important;
    text-transform: uppercase;
    color: #000 !important;
    box-shadow: none !important;
    height: auto !important;
}

/* Focused State */
.woocommerce form .form-row input.input-text:focus {
    border-bottom-color: #000 !important;
}


.cky-consent-bar .cky-notice-des p, 
.cky-gpc-wrapper .cky-gpc-desc p, 
.cky-notice-btn-wrapper .cky-btn,
.cky-preference-body-wrapper 
.cky-preference-content-wrapper p, 
.cky-accordion-header-wrapper 
.cky-accordion-header-des p, 
.cky-cookie-des-table li div:last-child p {font-size:14px!important;}

[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover {color:#000; background-color:transparent;}

.elementor-nav-menu--dropdown .elementor-item:hover {background-color:transparent!important;}
.elementor-nav-menu a:hover {padding:0;}

.woocommerce form .form-row input.input-text {padding-left:10px!important;}
