/* ==========================================================================
   ELX store polish — linked last in <head>, after the legacy inline CSS.
   Brings shop, product, cart, checkout, account and Specials in line with the
   ELX system: typography, surfaces, controls, cookie banner and mobile dock.
   Colours themselves were re-toned at source (see README v300).
   ========================================================================== */

body.elx,
body.elx button,
body.elx input,
body.elx select,
body.elx textarea,
body.elx .button,
body.elx h1, body.elx h2, body.elx h3, body.elx h4, body.elx h5, body.elx h6 {
    font-family: var(--elx-sans) !important;
}
body.elx h1, body.elx h2, body.elx h3 { letter-spacing: -.035em; font-weight: 500 !important; }
body.elx .woocommerce-products-header__title,
body.elx .product_title,
body.elx .entry-title,
body.elx .page-title { letter-spacing: -.045em !important; font-weight: 500 !important; }

/* page surfaces: warm bone page, paper cards */
body.elx:not(.home) .site-main,
body.elx:not(.home) .site-content { background: transparent !important; }

/* ---------- Buttons ---------- */
body.elx .woocommerce a.button,
body.elx .woocommerce button.button,
body.elx .woocommerce input.button,
body.elx .woocommerce #respond input#submit,
body.elx a.button,
body.elx button.button,
body.elx .single_add_to_cart_button,
body.elx .checkout-button,
body.elx #place_order {
    border-radius: 999px !important;
    font-weight: 500 !important;
    letter-spacing: -.005em !important;
    transition: background-color .4s cubic-bezier(.16, 1, .3, 1), transform .4s cubic-bezier(.16, 1, .3, 1), box-shadow .4s !important;
}
body.elx .woocommerce a.button:hover,
body.elx .woocommerce button.button:hover,
body.elx .single_add_to_cart_button:hover,
body.elx .checkout-button:hover,
body.elx #place_order:hover { background-color: var(--elx-forest) !important; transform: translateY(-1px); }

/* ---------- Product loop cards ---------- */
body.elx ul.products li.product {
    background: var(--elx-paper) !important;
    border: 1px solid var(--elx-line) !important;
    box-shadow: none !important;
    transition: transform .6s cubic-bezier(.16, 1, .3, 1), box-shadow .6s cubic-bezier(.16, 1, .3, 1) !important;
}
body.elx ul.products li.product:hover { transform: translateY(-4px); box-shadow: var(--elx-shadow) !important; }
body.elx ul.products li.product .woocommerce-loop-product__title { font-weight: 500 !important; letter-spacing: -.01em !important; }
body.elx ul.products li.product .price { font-weight: 500 !important; letter-spacing: -.02em; }
body.elx ul.products li.product img { transition: transform 1s cubic-bezier(.16, 1, .3, 1) !important; }
body.elx ul.products li.product:hover img { transform: scale(1.04); }
body.elx .onsale,
body.elx span.onsale { background: var(--elx-green) !important; color: var(--elx-paper) !important; border-radius: 999px !important; font-family: var(--elx-mono) !important; font-size: 10.5px !important; letter-spacing: .1em; text-transform: uppercase; }

/* ---------- Forms ---------- */
body.elx input[type="text"], body.elx input[type="email"], body.elx input[type="tel"],
body.elx input[type="password"], body.elx input[type="number"], body.elx input[type="search"]:not(#elx-search-input),
body.elx select, body.elx textarea {
    border-color: var(--elx-line-strong) !important;
    background-color: var(--elx-paper) !important;
}
body.elx input:focus, body.elx select:focus, body.elx textarea:focus {
    border-color: var(--elx-green) !important;
    box-shadow: 0 0 0 4px rgba(242, 183, 5, .2) !important;
    outline: none !important;
}

/* ---------- Breadcrumb ---------- */
body.elx .woocommerce-breadcrumb { font-family: var(--elx-mono) !important; font-size: 11px !important; letter-spacing: .12em; text-transform: uppercase; color: var(--elx-muted) !important; }
body.elx .woocommerce-breadcrumb a { color: var(--elx-green) !important; }

/* ---------- Cookie banner ---------- */
body.elx .els-cookie-banner__panel,
body.elx .els-cookie-preferences {
    background: rgba(23, 20, 12, .96) !important;
    color: rgba(243, 239, 230, .82) !important;
    border: 1px solid rgba(243, 239, 230, .12) !important;
    border-radius: 22px !important;
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    box-shadow: 0 30px 60px -24px rgba(10, 20, 14, .55) !important;
}
body.elx .els-cookie-banner__title,
body.elx .els-cookie-choice__title { color: var(--elx-paper) !important; letter-spacing: -.02em; }
body.elx .els-cookie-banner__text,
body.elx .els-cookie-choice__desc,
body.elx .els-cookie-preferences__intro { color: rgba(243, 239, 230, .72) !important; }
body.elx .els-cookie-banner a,
body.elx .els-cookie-preferences a { color: var(--elx-leaf-2) !important; }
body.elx .els-cookie-banner button,
body.elx .els-cookie-preferences button {
    border-radius: 999px !important;
    font-family: var(--elx-sans) !important; font-weight: 500 !important;
    border: 1px solid rgba(243, 239, 230, .24) !important;
    background: transparent !important; color: var(--elx-paper) !important;
}
body.elx #els-cookie-accept,
body.elx #els-cookie-save { background: var(--elx-leaf-2) !important; border-color: var(--elx-leaf-2) !important; color: var(--elx-forest) !important; }
body.elx .els-cookie-settings { background: var(--elx-forest) !important; color: var(--elx-paper) !important; border-radius: 999px !important; }

/* ---------- Mobile dock ---------- */
body.elx .els-v262-mobile-nav {
    background: rgba(23, 20, 12, .92) !important;
    -webkit-backdrop-filter: saturate(140%) blur(18px) !important; backdrop-filter: saturate(140%) blur(18px) !important;
    border: 1px solid rgba(243, 239, 230, .1) !important;
    box-shadow: 0 18px 40px -18px rgba(10, 20, 14, .6) !important;
}
body.elx .els-v262-mobile-nav__item { color: rgba(243, 239, 230, .62) !important; }
body.elx .els-v262-mobile-nav__label { font-family: var(--elx-sans) !important; font-weight: 500 !important; letter-spacing: 0 !important; }
body.elx .els-v262-mobile-nav__item.is-active { color: var(--elx-paper) !important; }
body.elx .els-v262-mobile-nav__item.is-active .els-v262-mobile-nav__icon { background: rgba(255, 210, 63, .22) !important; color: var(--elx-leaf-2) !important; }
body.elx .els-v262-mobile-nav__count { background: var(--elx-leaf-2) !important; color: var(--elx-forest) !important; }

/* ---------- Specials landing (bare page, no site chrome) ---------- */
body.elx.page-specials,
body.elx .els-sp-page { background: var(--elx-bone) !important; }
.elx .elx-spbar { position: relative; z-index: 5; border-bottom: 1px solid var(--elx-line); background: rgba(243, 239, 230, .85); }
.elx .elx-spbar__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.elx .elx-spbar__call { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 18px; border-radius: 999px; background: var(--elx-forest); color: var(--elx-paper) !important; text-decoration: none !important; font-weight: 500; font-size: 14px; transition: background .4s; }
.elx .elx-spbar__call:hover { background: var(--elx-green); }
@media (max-width: 520px) { .elx .elx-spbar__call span { display: none; } .elx .elx-spbar__call { width: 44px; padding: 0; justify-content: center; } }

/* ---------- WooCommerce notices ---------- */
body.elx .woocommerce-info::before,
body.elx .woocommerce-message::before { color: var(--elx-green) !important; }
body.elx .woocommerce-info,
body.elx .woocommerce-message { border-top-color: var(--elx-green) !important; }

/* ---------- Specials: sizing prompt ---------- */
.elx .elx-sp-sizer { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; margin-top: 8px; margin-bottom: 8px; padding: 16px 16px 16px 24px; border-radius: 22px; background: var(--elx-mint); border: 1px solid rgba(138, 98, 0, .14); }
.elx .elx-sp-sizer p { margin: 0; color: var(--elx-moss); font-size: 15px; }
.elx .elx-sp-sizer strong { color: var(--elx-forest); }
.elx .elx-sp-sizer .elx-btn { min-height: 48px; }
.elx .els-sp-special-section .is-elx-target { box-shadow: 0 0 0 3px var(--elx-leaf), var(--elx-shadow) !important; transition: box-shadow .6s; }