/* --- BASE THEME STYLES --- */
/*
Theme Name:  Flextribe
Description: Flextribe Child Theme — Premium Packaging UI for Elementor Pro + WooCommerce
Author:      Flextribe
Template:    hello-elementor
Version:     1.0.0
Tags:        elementor, woocommerce, ecommerce
Text Domain: flextribe
*/

/* ============================================================
   BRAND CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
    --flex-orange:    #F3924D;
    --flex-orange-dk: #e08442;
    --flex-charcoal:  #414042;
    --flex-charcoal-dk: #2a2a2b;
    --flex-light:     #D1D3D4;
    --flex-white:     #FFFFFF;
    --flex-offwhite:  #F8F9FA;

    --flex-font-heading: 'Poppins', sans-serif;
    --flex-font-body:    'Roboto', sans-serif;
    --flex-font-mono:    'JetBrains Mono', monospace;

    --flex-radius-card:  2rem;
    --flex-radius-card-lg: 2.5rem;
    --flex-radius-btn:   0.75rem;
    --flex-shadow-card:  0 1px 3px 0 rgba(0,0,0,0.06), 0 1px 2px 0 rgba(0,0,0,0.04);
    --flex-shadow-lift:  0 20px 25px -5px rgba(0,0,0,0.10), 0 10px 10px -5px rgba(0,0,0,0.04);
    --flex-shadow-orange: 0 10px 15px -3px rgba(243,146,77,0.3);
}

/* ============================================================
   BASE RESETS
   ============================================================ */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--flex-font-body);
    background-color: var(--flex-offwhite);
    color: var(--flex-charcoal);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--flex-font-heading);
}

/* ============================================================
   HOVER LIFT — used on product cards, feature cards
   ============================================================ */
.flex-hover-lift {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275),
                box-shadow 0.3s ease !important;
    cursor: pointer;
}
.flex-hover-lift:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.10),
                0 10px 10px -5px rgba(0,0,0,0.04) !important;
}

/* ============================================================
   BUTTON — orange primary, full-width variant
   ============================================================ */
.flex-btn-orange {
    display: inline-block;
    background: var(--flex-orange);
    color: #fff !important;
    padding: 1.125rem 2rem;
    border-radius: var(--flex-radius-btn);
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s;
    box-shadow: var(--flex-shadow-orange);
}
.flex-btn-orange:hover {
    background: var(--flex-orange-dk) !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(243,146,77,0.45);
}
.flex-btn-orange-full { width: 100%; display: block; }

/* ============================================================
   DIAGONAL BACKGROUND — wholesale/CTA dark section
   ============================================================ */
.flex-diagonal-bg {
    background: linear-gradient(135deg, var(--flex-charcoal) 0%, var(--flex-charcoal-dk) 100%);
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
}

/* ============================================================
   IMAGE MASK — hero image asymmetric border-radius
   ============================================================ */
.flex-image-mask {
    border-radius: 40px 0px 40px 0px;
}

/* ============================================================
   MARQUEE ANIMATION — ticker keyframes (defined here so custom
   CSS cannot accidentally override them)
   ============================================================ */
@keyframes fxt-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-33.333%); }
}
@keyframes fxt-marquee-fb {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
/* Legacy alias */
@keyframes flex-marquee {
    0%   { transform: translateX(0%); }
    100% { transform: translateX(-50%); }
}

/* Ticker container — protected from generic CSS resets */
.fxt-ticker-wrap {
    overflow: hidden !important;
    padding: 16px 0 !important;
    display: block !important;
    position: relative;
}
.fxt-ticker-track {
    white-space: nowrap !important;
    display: inline-flex !important;
    animation-name: fxt-marquee !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
    animation-duration: 30s;
    will-change: transform;
}
.fxt-ticker-item {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.fxt-ticker-dot {
    display: inline !important;
    visibility: visible !important;
}

/* ============================================================
   SECTION LABEL — orange dot + mono uppercase text
   ============================================================ */
.flex-section-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.775rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--flex-orange);
}
.flex-section-label::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--flex-orange);
    flex-shrink: 0;
}

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.flex-breadcrumb {
    font-family: var(--flex-font-mono);
    font-size: 0.775rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #9ca3af;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.flex-breadcrumb a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s;
}
.flex-breadcrumb a:hover {
    color: var(--flex-charcoal);
}
.flex-breadcrumb-sep {
    color: var(--flex-light);
}
.flex-breadcrumb-current {
    color: var(--flex-charcoal);
    font-weight: 600;
}

/* ============================================================
   BUTTONS
   ============================================================ */

/* Primary — Orange */
.flex-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background-color: var(--flex-orange);
    color: var(--flex-white);
    border: none;
    border-radius: var(--flex-radius-btn);
    padding: 0.875rem 1.75rem;
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.2s, transform 0.2s;
    box-shadow: var(--flex-shadow-orange);
}
.flex-btn-primary:hover {
    background-color: var(--flex-orange-dk);
    color: var(--flex-white);
}

/* Dark — Charcoal */
.flex-btn-dark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background-color: var(--flex-charcoal);
    color: var(--flex-white);
    border: none;
    border-radius: var(--flex-radius-btn);
    padding: 0.875rem 1.75rem;
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.2s, transform 0.2s;
    box-shadow: 0 10px 15px -3px rgba(65,64,66,0.2);
}
.flex-btn-dark:hover {
    background-color: #000;
    color: var(--flex-white);
    transform: translateY(-2px);
}

/* Ghost — Outlined charcoal */
.flex-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: var(--flex-charcoal);
    border: 2px solid var(--flex-charcoal);
    border-radius: var(--flex-radius-btn);
    padding: 0.875rem 1.75rem;
    font-family: var(--flex-font-heading);
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.2s, color 0.2s;
}
.flex-btn-ghost:hover {
    background-color: var(--flex-charcoal);
    color: var(--flex-white);
}

/* ============================================================
   CARDS
   ============================================================ */
.flex-card {
    background-color: var(--flex-white);
    border: 1px solid rgba(209, 211, 212, 0.4);
    border-radius: var(--flex-radius-card);
    box-shadow: var(--flex-shadow-card);
    overflow: hidden;
}

.flex-card-lg {
    background-color: var(--flex-white);
    border: 1px solid rgba(209, 211, 212, 0.4);
    border-radius: var(--flex-radius-card-lg);
    box-shadow: var(--flex-shadow-card);
    overflow: hidden;
}

/* ============================================================
   INPUTS & FORMS
   ============================================================ */
.flex-input {
    width: 100%;
    background-color: var(--flex-offwhite);
    border: 1px solid rgba(209, 211, 212, 0.4);
    border-radius: var(--flex-radius-btn);
    padding: 0.875rem 1rem;
    font-family: var(--flex-font-body);
    font-size: 0.875rem;
    color: var(--flex-charcoal);
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.flex-input::placeholder {
    color: #9ca3af;
}
.flex-input:focus {
    border-color: var(--flex-orange);
    box-shadow: 0 0 0 4px rgba(243, 146, 77, 0.1);
}

.flex-input-dark {
    width: 100%;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.3);
    padding: 0.5rem 0;
    font-family: var(--flex-font-body);
    font-size: 0.875rem;
    color: var(--flex-white);
    outline: none;
    transition: border-color 0.2s;
}
.flex-input-dark::placeholder {
    color: #9ca3af;
}
.flex-input-dark:focus {
    border-bottom-color: var(--flex-orange);
}

/* ============================================================
   BADGE / TAG
   ============================================================ */
.flex-badge-orange {
    display: inline-block;
    background-color: var(--flex-orange);
    color: var(--flex-white);
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.725rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.375rem 0.75rem;
    border-radius: 0.375rem;
}
.flex-badge-dark {
    display: inline-block;
    background-color: var(--flex-charcoal);
    color: var(--flex-white);
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.725rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.375rem 0.75rem;
    border-radius: 0.375rem;
}

/* ============================================================
   SKU / MONO LABEL
   ============================================================ */
.flex-sku {
    font-family: var(--flex-font-mono);
    font-size: 0.775rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #9ca3af;
}

/* ============================================================
   ACCORDION (product page tabs)
   ============================================================ */
.flex-accordion details {
    border-bottom: 1px solid rgba(209, 211, 212, 0.3);
}
.flex-accordion details > summary {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--flex-font-heading);
    font-weight: 500;
    font-size: 1.125rem;
    color: var(--flex-charcoal);
    cursor: pointer;
    padding: 1.25rem 0;
    outline: none;
}
.flex-accordion details > summary::-webkit-details-marker {
    display: none;
}
.flex-accordion details > summary .flex-accordion-icon {
    font-size: 1.5rem;
    font-weight: 300;
    color: var(--flex-light);
    transition: transform 0.3s ease;
    line-height: 1;
}
.flex-accordion details[open] > summary .flex-accordion-icon {
    transform: rotate(45deg);
}
.flex-accordion details > div {
    color: #6b7280;
    font-family: var(--flex-font-body);
    font-size: 0.875rem;
    line-height: 1.7;
    padding-bottom: 1.5rem;
    padding-right: 1rem;
}

/* ============================================================
   RADIO CARD (shipping & billing selection)
   ============================================================ */
.flex-radio-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 1rem;
    border: 2px solid transparent;
    background-color: var(--flex-white);
    cursor: pointer;
    transition: all 0.2s ease;
}
.flex-radio-card:hover {
    border-color: rgba(65, 64, 66, 0.3);
}
.flex-radio-card.active {
    border-color: var(--flex-charcoal);
    background-color: var(--flex-offwhite);
}
.flex-radio-dot {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    border: 2px solid var(--flex-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: border-color 0.2s;
}
.flex-radio-card.active .flex-radio-dot {
    border-color: var(--flex-charcoal);
}
.flex-radio-dot-inner {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    background-color: var(--flex-charcoal);
    display: none;
}
.flex-radio-card.active .flex-radio-dot-inner {
    display: block;
}

/* ============================================================
   FREE SHIPPING PROGRESS BAR
   ============================================================ */
.flex-progress-track {
    width: 100%;
    height: 6px;
    background-color: rgba(209, 211, 212, 0.4);
    border-radius: 999px;
    overflow: hidden;
}
.flex-progress-fill {
    height: 100%;
    background-color: var(--flex-orange);
    border-radius: 999px;
    transition: width 0.5s ease-out;
}

/* ============================================================
   CHECKOUT STEPPER
   ============================================================ */
.flex-stepper {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.flex-step {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
}
.flex-step-done {
    background-color: var(--flex-charcoal);
    color: var(--flex-white);
}
.flex-step-active {
    background-color: var(--flex-orange);
    color: var(--flex-white);
    box-shadow: 0 4px 6px -1px rgba(243,146,77,0.3);
}
.flex-step-pending {
    border: 2px solid var(--flex-charcoal);
    color: var(--flex-charcoal);
    opacity: 0.4;
}
.flex-step-line {
    width: 2rem;
    height: 1px;
    background-color: var(--flex-light);
}

/* ============================================================
   QTY ADJUSTER (+/-)
   ============================================================ */
.flex-qty-adjuster {
    display: flex;
    align-items: center;
    border: 1px solid rgba(209, 211, 212, 0.8);
    border-radius: var(--flex-radius-btn);
    background-color: var(--flex-white);
    height: 3rem;
    overflow: hidden;
}
.flex-qty-btn {
    width: 3rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--flex-font-mono);
    font-size: 1.125rem;
    color: var(--flex-charcoal);
    background: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s;
}
.flex-qty-btn:hover {
    background-color: var(--flex-offwhite);
}
.flex-qty-val {
    width: 2.5rem;
    text-align: center;
    font-family: var(--flex-font-mono);
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--flex-charcoal);
}

/* ============================================================
   SIZE SELECTOR BUTTONS (product page)
   ============================================================ */
.flex-size-btn {
    padding: 0.75rem 0.5rem;
    border: 1px solid rgba(209, 211, 212, 0.5);
    border-radius: var(--flex-radius-btn);
    text-align: center;
    background-color: var(--flex-white);
    color: var(--flex-charcoal);
    cursor: pointer;
    transition: all 0.2s;
}
.flex-size-btn:hover {
    border-color: var(--flex-charcoal);
}
.flex-size-btn.active {
    background-color: var(--flex-charcoal);
    border-color: var(--flex-charcoal);
    color: var(--flex-white);
    box-shadow: 0 4px 6px -1px rgba(65,64,66,0.2);
}

/* ============================================================
   FILTER TABS (products page)
   ============================================================ */
.flex-filter-tab {
    padding: 0.625rem 1.25rem;
    border-radius: 999px;
    font-family: var(--flex-font-mono);
    font-size: 0.775rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border: 1px solid var(--flex-light);
    background-color: transparent;
    color: var(--flex-charcoal);
    cursor: pointer;
    transition: all 0.2s;
}
.flex-filter-tab:hover {
    border-color: var(--flex-charcoal);
}
.flex-filter-tab.active {
    background-color: var(--flex-charcoal);
    border-color: var(--flex-charcoal);
    color: var(--flex-white);
}

/* ============================================================
   PAYMENT TAB BUTTONS (checkout)
   ============================================================ */
.flex-pay-tab {
    padding: 1rem 0.5rem;
    border: 2px solid transparent;
    border-radius: var(--flex-radius-btn);
    background-color: var(--flex-offwhite);
    color: #9ca3af;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    cursor: pointer;
    transition: all 0.2s;
}
.flex-pay-tab:hover {
    color: var(--flex-charcoal);
    background-color: #f0f0f0;
}
.flex-pay-tab.active {
    border-color: var(--flex-charcoal);
    color: var(--flex-charcoal);
}

/* ============================================================
   STATS BLOCK (hero dark card)
   ============================================================ */
.flex-stats-block {
    background-color: var(--flex-charcoal);
    border-radius: 1.5rem;
    padding: 2rem;
    color: var(--flex-white);
    position: relative;
    overflow: hidden;
}
.flex-stats-block::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 8rem;
    height: 8rem;
    background-color: rgba(243, 146, 77, 0.2);
    border-radius: 50%;
    filter: blur(2rem);
    pointer-events: none;
}

/* ============================================================
   TRUST LOGOS RAIL
   ============================================================ */
.flex-trust-item {
    font-family: var(--flex-font-heading);
    font-weight: 500;
    font-size: 1.125rem;
    color: #9ca3af;
    opacity: 0.8;
    transition: opacity 0.2s;
}
.flex-trust-item:hover {
    opacity: 1;
}

/* ============================================================
   NEWSLETTER FORM (footer)
   ============================================================ */
.flex-newsletter-form {
    display: flex;
    width: 100%;
    background-color: rgba(255,255,255,0.1);
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.2);
    overflow: hidden;
    transition: border-color 0.2s;
}
.flex-newsletter-form:focus-within {
    border-color: var(--flex-orange);
}
.flex-newsletter-input {
    flex: 1;
    background: transparent;
    border: none;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: var(--flex-white);
    outline: none;
}
.flex-newsletter-input::placeholder {
    color: #6b7280;
}
.flex-newsletter-btn {
    background-color: var(--flex-orange);
    color: var(--flex-white);
    border: none;
    padding: 0 1.5rem;
    font-family: var(--flex-font-heading);
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.2s;
}
.flex-newsletter-btn:hover {
    background-color: var(--flex-orange-dk);
}


/* ============================================================
   ELEMENTOR OVERRIDES
   ============================================================ */
.elementor-page {
    overflow-x: hidden;
}

/* ============================================================
   ELEMENTOR HEADER — Theme Builder fixes
   ============================================================ */


/* Header logo F icon hover */
.elementor-location-header a:hover > div:first-child {
    background-color: var(--flex-orange) !important;
}

/* Nav menu styling overrides */
.elementor-location-header .elementor-nav-menu a.elementor-item {
    font-family: var(--flex-font-heading) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: var(--flex-charcoal) !important;
    text-decoration: none !important;
    padding: 8px 0 !important;
}
.elementor-location-header .elementor-nav-menu a.elementor-item:hover,
.elementor-location-header .elementor-nav-menu a.elementor-item.elementor-item-active {
    color: var(--flex-orange) !important;
}
.elementor-location-header .elementor-nav-menu--main .elementor-item-anchor {
    display: none;
}

/* Shop Now button in header */
.elementor-location-header .elementor-button {
    background-color: var(--flex-orange) !important;
    color: #fff !important;
    border-radius: 12px !important;
    font-family: var(--flex-font-heading) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 12px 24px !important;
    border: none !important;
    box-shadow: 0 4px 6px -1px rgba(243,146,77,0.3) !important;
    transition: background-color 0.2s !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.elementor-location-header .elementor-button:hover {
    background-color: var(--flex-orange-dk) !important;
    color: #fff !important;
}

/* WooCommerce cart in header */
.elementor-location-header .elementor-menu-cart__toggle .elementor-button {
    background: none !important;
    box-shadow: none !important;
    border: none !important;
    color: var(--flex-charcoal) !important;
    padding: 8px !important;
    transition: color 0.2s !important;
}
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:hover {
    color: var(--flex-orange) !important;
    background: none !important;
}
.elementor-location-header .elementor-menu-cart__toggle_button .elementor-button-icon {
    font-size: 22px !important;
}

/* Page top padding to account for fixed header */
body:not(.elementor-editor-active) {
    padding-top: 70px;
}
@media (min-width: 768px) {
    body:not(.elementor-editor-active) {
        padding-top: 96px;
    }
}

/* ============================================================
   ELEMENTOR FOOTER — Theme Builder fixes
   ============================================================ */

/* Footer links hover */
.elementor-location-footer a:hover {
    color: var(--flex-orange) !important;
}

/* Newsletter input focus */
.elementor-location-footer input[type="email"]:focus {
    outline: none;
    border-color: var(--flex-orange) !important;
}

/* Footer grid responsive */
@media (max-width: 768px) {
    .elementor-location-footer .e-con[data-id="ftr-grid"] {
        flex-direction: column !important;
    }
    .elementor-location-footer .e-con[data-id="ftr-brand-col"],
    .elementor-location-footer .e-con[data-id="ftr-shop-col"],
    .elementor-location-footer .e-con[data-id="ftr-co-col"],
    .elementor-location-footer .e-con[data-id="ftr-nl-col"] {
        width: 100% !important;
    }
}

/* ============================================================
   HOMEPAGE — WHY US STICKY LEFT COLUMN
   ============================================================ */
.fxt-sticky {
    position: sticky;
    top: 120px;
    align-self: flex-start;
}

/* ============================================================
   HOMEPAGE — WHOLESALE CTA GRADIENT BACKGROUND
   ============================================================ */
.fxt-ws-bg {
    background: linear-gradient(135deg, #414042 0%, #2a2a2b 100%) !important;
}

/* ============================================================
   HOMEPAGE — PRODUCT CARDS equal height image area
   ============================================================ */
/* Ensure Why Us cards stretch to fill column height */
.elementor-element[data-id="why-cards"] > .e-con {
    flex: 1 1 auto;
}

/* Ensure product card images cover properly */
.elementor-element[data-id="p1-img"],
.elementor-element[data-id="p2-img"],
.elementor-element[data-id="hero-big"],
.elementor-element[data-id="hero-small"],
.elementor-element[data-id="story-img"] {
    background-size: cover !important;
    background-position: center center !important;
}

/* ============================================================
   HOMEPAGE — SECTION MAX-WIDTH CONSTRAINT
   ============================================================ */
.elementor-element[data-id="hero-grid"],
.elementor-element[data-id="ph"],
.elementor-element[data-id="pg"],
.elementor-element[data-id="story-grid"],
.elementor-element[data-id="why-grid"],
.elementor-element[data-id="trust-i"],
.elementor-element[data-id="ws-outer"] > .e-con {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* ============================================================
   HOMEPAGE — HERO HEADING em italic
   ============================================================ */
.elementor-element[data-id="hero-h1"] em,
.elementor-element[data-id="ph-h2"] em,
.elementor-element[data-id="story-h2"] em,
.elementor-element[data-id="why-h2"] em,
.elementor-element[data-id="ws-h2"] em {
    font-style: italic;
    color: #F3924D;
}

/* ============================================================
   ELEMENTOR — Suppress default widget separator lines inside cards
   (the blue/gray lines visible in admin view are Elementor edit handles
    and vanish for logged-out visitors — but this removes any real CSS borders)
   ============================================================ */
.elementor-element[data-id^="wc"] .elementor-widget:not(:last-child) {
    border-bottom: none !important;
    margin-bottom: 0 !important;
}
.elementor-element[data-id^="wc"] .elementor-widget-container {
    padding: 0 !important;
}
/* Remove widget separator lines inside product cards too */
.elementor-element[data-id="p1"] .elementor-widget:not(:last-child),
.elementor-element[data-id="p2"] .elementor-widget:not(:last-child) {
    border-bottom: none !important;
}

/* ============================================================
   HOMEPAGE — CARD BOX SHADOWS (ensure on product & feature cards)
   ============================================================ */
.elementor-element[data-id="p1"],
.elementor-element[data-id="p2"] {
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.06), 0 1px 2px 0 rgba(0,0,0,0.04);
    transition: transform 0.3s cubic-bezier(0.175,0.885,0.32,1.275), box-shadow 0.3s ease;
}
.elementor-element[data-id="p1"]:hover,
.elementor-element[data-id="p2"]:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.10), 0 10px 10px -5px rgba(0,0,0,0.04);
}

/* Why Us feature cards */
.elementor-element[data-id^="wc"] {
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.06);
    transition: transform 0.3s cubic-bezier(0.175,0.885,0.32,1.275), box-shadow 0.3s ease;
}
.elementor-element[data-id^="wc"]:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.10);
}

/* ============================================================
   RESPONSIVE — stack hero columns on tablet/mobile
   ============================================================ */
@media (max-width: 1024px) {
    .elementor-element[data-id="hero-grid"],
    .elementor-element[data-id="story-grid"],
    .elementor-element[data-id="why-grid"] {
        flex-wrap: wrap !important;
    }
    .elementor-element[data-id="hero-left"],
    .elementor-element[data-id="hero-right"],
    .elementor-element[data-id="story-img"],
    .elementor-element[data-id="story-text"],
    .elementor-element[data-id="why-left"],
    .elementor-element[data-id="why-cards"] {
        width: 100% !important;
    }
    .fxt-sticky {
        position: relative;
        top: auto;
    }
    .elementor-element[data-id="p1"],
    .elementor-element[data-id="p2"] {
        width: 100% !important;
    }
}



/* --- GLOBAL RESPONSIVE CONTAINER (Shaheer's Speed & Spacing Fix) --- */
.fxt-main-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .fxt-main-container {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
    
    /* Global Mobile Fix to prevent horizontal scroll */
    html, body {
        overflow-x: hidden;
        width: 100%;
        position: relative;
    }
}


/* --- CART PAGE — layout only (item cards, grid in flextribe.css) --- */
.fxt-cart-wrap .woocommerce,
.fxt-cart-wrap .entry-content { max-width: none !important; padding: 0 !important; margin: 0 !important; }
.fxt-cart-wrap { background: #F8F9FA; min-height: 60vh; }
.fxt-cart-main { padding: 3rem 0 5rem; background: #F8F9FA; }
#fxt-cart-form { display: flex; flex-direction: column; gap: 1.25rem; }
.fxt-cart-notices { max-width: 1280px; margin: 0 auto; padding: 1.25rem 1rem 0; }
@media(min-width:640px) { .fxt-cart-notices { padding: 1.25rem 1.5rem 0; } }
@media(min-width:1024px){ .fxt-cart-notices { padding: 1.25rem 2rem 0; } }

/* Cart empty state */
.fxt-cart-empty {
    max-width: 46rem; margin: 3rem auto 5rem;
    background: #fff; border: 1px solid rgba(209,211,212,0.4);
    border-radius: 2.5rem; padding: 5rem 2rem; text-align: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    display: flex; flex-direction: column; align-items: center;
}
.fxt-cart-empty-icon {
    width: 5rem; height: 5rem; background: #F8F9FA; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid rgba(209,211,212,0.5); margin-bottom: 1.5rem; color: #D1D3D4;
}
.fxt-cart-empty-icon svg { width: 2.5rem; height: 2.5rem; }
.fxt-cart-empty h3 { font-family: 'Poppins',sans-serif; font-weight: 800; font-size: 2rem; color: #414042; margin: 0 0 1rem; }
.fxt-cart-empty p { font-family: 'Roboto',sans-serif; color: #6b7280; margin: 0 0 2rem; max-width: 26rem; line-height: 1.6; }
.fxt-btn-dark { display: inline-block; background: #414042; color: #fff; padding: 1rem 2rem; border-radius: 0.875rem; font-family: 'Poppins',sans-serif; font-weight: 700; font-size: 0.875rem; text-decoration: none; transition: background 0.2s; }
.fxt-btn-dark:hover { background: #000; color: #fff; }

/* Applied coupon row & misc */
.fxt-applied-coupon { display: flex; justify-content: space-between; align-items: center; font-family: 'JetBrains Mono',monospace; font-size: 0.6875rem; letter-spacing: 0.1em; text-transform: uppercase; color: #6b7280; padding: 0.5rem 0; border-top: 1px solid rgba(209,211,212,0.3); margin-top: 0.25rem; }
.fxt-green { color: #16a34a !important; }
.fxt-coupon-input::placeholder { color: #9ca3af; }
.fxt-ship-progress-label strong { font-weight: 700; }
.fxt-ship-progress-fill { min-width: 2px; }
.fxt-payment-icons { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.375rem; }
.fxt-pay-icon { padding: 0.25rem 0.625rem; border: 1px solid rgba(209,211,212,0.5); border-radius: 0.25rem; font-family: 'JetBrains Mono',monospace; font-size: 0.675rem; letter-spacing: 0.15em; text-transform: uppercase; color: #9ca3af; background: #F8F9FA; }

/* --- CHECKOUT PAGE STYLES --- */
/* ── Base ───────────────────────────────────────────── */
.fxt-checkout-page { background:#F8F9FA; min-height:100vh; }
.fxt-checkout-page *, .fxt-checkout-page *::before, .fxt-checkout-page *::after { box-sizing:border-box; }

/* Remove Hello Elementor body padding (applied for its fixed header) */
body.fxt-checkout-page,
.fxt-checkout-page.elementor-default { padding-top: 0 !important; margin-top: 0 !important; }

/* Push sticky nav down if WP admin bar is visible (logged-in users) */
.admin-bar .fxt-co-nav { top: 32px; }
@media (max-width: 782px) { .admin-bar .fxt-co-nav { top: 46px; } }

/* ── Slim nav ───────────────────────────────────────── */
.fxt-co-nav {
    background: rgba(255,255,255,0.75);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: none;
    box-shadow: none;
    position:sticky;
    top:0;
    z-index:9999;
    height:70px;
}
@media(min-width:768px){ .fxt-co-nav { height:95px; } }
.fxt-co-nav-inner {
    max-width:1280px;
    margin:0 auto;
    padding:0 1rem;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}
@media(min-width:640px) { .fxt-co-nav-inner { padding:0 1.5rem; } }
@media(min-width:1024px){ .fxt-co-nav-inner { padding:0 2rem; } }

/* Logo */
.fxt-co-logo {
    display:flex;
    align-items:center;
    gap:0.75rem;
    text-decoration:none;
}
.fxt-co-logo-icon {
    width:2.5rem;
    height:2.5rem;
    background:#414042;
    border-radius:0.75rem;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:1.25rem;
    box-shadow:0 4px 6px -1px rgba(0,0,0,0.2);
    transition:background 0.3s;
    flex-shrink:0;
}
.fxt-co-logo:hover .fxt-co-logo-icon { background:#F3924D; }
@media(min-width:768px){ .fxt-co-logo-icon { width:3rem; height:3rem; font-size:1.5rem; } }
.fxt-co-logo-text { display:none; flex-direction:column; }
@media(min-width:640px){ .fxt-co-logo-text { display:flex; } }
.fxt-co-logo-name {
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:1.25rem;
    color:#414042;
    letter-spacing:-0.025em;
    line-height:1;
}
.fxt-co-logo-img {
    width:72px;
    height:auto;
    display:block;
}
@media(min-width:640px){ .fxt-co-logo-img { width:100px; } }

/* Stepper */
.fxt-co-stepper {
    display:flex;
    align-items:center;
    gap:0.5rem;
}
@media(min-width:640px){ .fxt-co-stepper { gap:1rem; } }
.fxt-co-step { display:flex; align-items:center; gap:0.5rem; }
.fxt-co-step-pending { opacity:0.4; }
.fxt-co-step-num {
    width:1.5rem;
    height:1.5rem;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'JetBrains Mono',monospace;
    font-size:0.75rem;
    font-weight:700;
    background:#414042;
    color:#fff;
    flex-shrink:0;
}
.fxt-co-step-done { background:#414042; color:#fff; }
.fxt-co-step-active { background:#F3924D; color:#fff; box-shadow:0 4px 8px -2px rgba(243,146,77,0.4); }
.fxt-co-step-num-pending { background:transparent; border:2px solid #414042; color:#414042; }
.fxt-co-step-lbl {
    display:none;
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    letter-spacing:0.15em;
    text-transform:uppercase;
    font-weight:700;
    color:#414042;
}
@media(min-width:768px){ .fxt-co-step-lbl { display:inline; } }
.fxt-co-step-line {
    width:1rem;
    height:1px;
    background:#D1D3D4;
    flex-shrink:0;
}
@media(min-width:640px){ .fxt-co-step-line { width:2rem; } }

/* Back link */
.fxt-co-back {
    font-family:'Poppins',sans-serif;
    font-weight:600;
    font-size:0.7rem;
    color:#414042;
    text-decoration:none;
    display:flex;
    align-items:center;
    gap:0.375rem;
    transition:color 0.2s, border-color 0.2s;
    border-bottom:1px solid #414042;
    padding-bottom:1px;
    white-space:nowrap;
}
.fxt-co-back:hover { color:#F3924D; border-color:#F3924D; }
.fxt-co-back span { display:inline; }

/* ── Notices ───────────────────────────────────────── */
.fxt-co-notices-inner {
    max-width:1280px;
    margin:0 auto;
    padding:1rem;
}
@media(min-width:640px) { .fxt-co-notices-inner { padding:1rem 1.5rem; } }
@media(min-width:1024px){ .fxt-co-notices-inner { padding:1rem 2rem; } }

/* ── Main ──────────────────────────────────────────── */
.fxt-co-main { padding:2.5rem 0 3rem; background:#F8F9FA; }
.fxt-co-container { max-width:1280px; margin:0 auto; padding:0 1rem; }
@media(min-width:640px) { .fxt-co-container { padding:0 1.5rem; } }
@media(min-width:1024px){ .fxt-co-container { padding:0 2rem; } }
.fxt-co-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:2.5rem;
    align-items:start;
}
@media(min-width:1024px){ .fxt-co-grid { grid-template-columns:7fr 5fr; } }

/* Left col */
.fxt-co-left { display:flex; flex-direction:column; gap:1.5rem; }
.fxt-co-form { display:flex; flex-direction:column; gap:1.5rem; }

/* Right col */
.fxt-co-right {
    position: sticky;
    top: 6rem;
    align-self: start;
}

/* ── Form Sections ─────────────────────────────────── */
.fxt-co-section {
    background:#fff;
    border:1px solid rgba(209,211,212,0.4);
    border-radius:2rem;
    padding:1.75rem 2rem;
    box-shadow:0 1px 3px rgba(0,0,0,0.04);
}
.fxt-co-section-head {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    margin-bottom:1.5rem;
}
.fxt-co-section-title {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:1.625rem;
    color:#414042;
    margin:0;
    line-height:1.2;
}
@media(min-width:768px){ .fxt-co-section-title { font-size:1.875rem; } }
.fxt-co-section-num {
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:#9ca3af;
}

/* ── Fields ────────────────────────────────────────── */
.fxt-co-fields { display:flex; flex-direction:column; gap:1.25rem; }
.fxt-co-row-2 {
    display:grid;
    grid-template-columns:1fr;
    gap:1.25rem;
}
@media(min-width:480px){ .fxt-co-row-2 { grid-template-columns:1fr 1fr; } }
.fxt-co-field-wrap { display:flex; flex-direction:column; gap:0.5rem; }
.fxt-co-label {
    font-family:'Poppins',sans-serif;
    font-weight:600;
    font-size:0.875rem;
    color:#414042;
}
.fxt-co-req { color:#F3924D; }
.fxt-co-opt { color:#9ca3af; font-weight:400; }
.fxt-co-input {
    width:100%;
    background:#F8F9FA !important;
    border:1px solid rgba(209,211,212,0.5) !important;
    color:#414042 !important;
    font-size:0.875rem !important;
    border-radius:0.875rem !important;
    padding:0.875rem 1rem !important;
    font-family:'Roboto',sans-serif !important;
    outline:none !important;
    transition:border-color 0.2s, box-shadow 0.2s !important;
    appearance:none;
    -webkit-appearance:none;
}
.fxt-co-input:focus {
    border-color:#F3924D !important;
    box-shadow:0 0 0 4px rgba(243,146,77,0.1) !important;
}
.fxt-co-input::placeholder { color:#9ca3af; }
.fxt-co-select-wrap { position:relative; }
.fxt-co-select { padding-right:2.5rem !important; cursor:pointer; }
.fxt-co-chevron {
    position:absolute;
    right:1rem;
    top:50%;
    transform:translateY(-50%);
    width:1rem;
    height:1rem;
    color:#9ca3af;
    pointer-events:none;
}

/* Checkbox row */
.fxt-co-check-row {
    display:flex;
    align-items:center;
    gap:0.875rem;
    cursor:pointer;
    font-family:'Roboto',sans-serif;
    font-size:0.875rem;
    color:#6b7280;
}
.fxt-co-check-row:hover { color:#414042; }
.fxt-co-check-box {
    position:relative;
    width:1.25rem;
    height:1.25rem;
    flex-shrink:0;
}
.fxt-co-check-box input[type="checkbox"] {
    width:1.25rem !important;
    height:1.25rem !important;
    border:2px solid rgba(209,211,212,0.8) !important;
    border-radius:0.375rem !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    background:#fff !important;
    cursor:pointer;
    padding:0 !important;
    transition:background 0.2s, border-color 0.2s !important;
}
.fxt-co-check-box input[type="checkbox"]:checked {
    background:#414042 !important;
    border-color:#414042 !important;
}
.fxt-co-check-svg {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:0.75rem;
    height:0.75rem;
    color:#fff;
    pointer-events:none;
    opacity:0;
    transition:opacity 0.2s;
}
.fxt-co-check-box input[type="checkbox"]:checked + .fxt-co-check-svg { opacity:1; }

/* ── Radio cards (shipping / billing) ────────────── */

/* Hide browser-native radio inputs — we use custom dots */
.fxt-co-radio-card input[type="radio"] { display:none !important; }

.fxt-co-radio-card {
    display:flex;
    align-items:center;
    gap:1rem;
    padding:1.25rem;
    border-radius:1.25rem;
    border:2px solid rgba(209,211,212,0.4);
    background:#fff;
    cursor:pointer;
    transition:border-color 0.2s, background 0.2s;
}
.fxt-co-radio-card:hover { border-color:rgba(65,64,66,0.3); }
.fxt-co-radio-card.active {
    border-color:#414042;
    background:#F8F9FA;
}
.fxt-co-radio-card input[type="radio"] { display:none; }
.fxt-co-radio-dot {
    width:1.25rem;
    height:1.25rem;
    border-radius:50%;
    border:2px solid rgba(209,211,212,0.8);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:border-color 0.2s;
}
.fxt-co-radio-dot::after {
    content:'';
    width:0.625rem;
    height:0.625rem;
    border-radius:50%;
    background:#414042;
    opacity:0;
    transition:opacity 0.2s;
}
.fxt-co-radio-card.active .fxt-co-radio-dot {
    border-color:#414042;
}
.fxt-co-radio-card.active .fxt-co-radio-dot::after { opacity:1; }
.fxt-co-radio-dot--active { border-color:#414042; }
.fxt-co-radio-dot--active::after { opacity:1; }
.fxt-co-radio-info { flex:1; min-width:0; }
.fxt-co-radio-title {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:0.9375rem;
    color:#414042;
}
.fxt-co-radio-sub {
    font-family:'Roboto',sans-serif;
    font-size:0.8125rem;
    color:#6b7280;
    margin-top:0.25rem;
}
.fxt-co-radio-price {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:0.9375rem;
    color:#414042;
    flex-shrink:0;
}

/* ── Secure note ────────────────────────────────── */
.fxt-co-secure-label {
    display:flex;
    align-items:center;
    gap:0.5rem;
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:#9ca3af;
    font-weight:700;
    margin-bottom:1.25rem;
}
.fxt-co-secure-label svg { width:0.75rem; height:0.75rem; color:#16a34a; }

/* ── WooCommerce payment section override ────────── */
#fxt-payment-area #payment { background:none; border:none; padding:0; }
#fxt-payment-area #payment .wc_payment_methods {
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:0.875rem;
}
#fxt-payment-area #payment .wc_payment_method {
    border:2px solid rgba(209,211,212,0.4);
    border-radius:1.25rem;
    overflow:hidden;
    transition:border-color 0.2s;
    background:#fff;
}
#fxt-payment-area #payment .wc_payment_method.fxt-pm-active {
    border-color:#414042;
    background:#F8F9FA;
}
#fxt-payment-area #payment .wc_payment_method > label {
    display:flex;
    align-items:center;
    gap:1rem;
    padding:1.125rem 1.25rem;
    cursor:pointer;
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:0.9375rem;
    color:#414042;
    margin:0;
    background:none;
}
#fxt-payment-area #payment .wc_payment_method > label img { max-height:1.5rem; width:auto; }
#fxt-payment-area #payment .wc_payment_method input[type="radio"] { display:none; }
#fxt-payment-area #payment .payment_box {
    padding:1rem 1.25rem 1.25rem;
    border-top:1px solid rgba(209,211,212,0.3);
    font-family:'Roboto',sans-serif;
    font-size:0.875rem;
    color:#6b7280;
    display:none;
}
#fxt-payment-area #payment .wc_payment_method.fxt-pm-active .payment_box { display:block; }
#fxt-payment-area #payment .payment_box p { margin:0; }
/* Hide WooCommerce's default submit inside payment */
#fxt-payment-area #payment .place-order { display:none !important; }
/* WC payment method radio dot */
#fxt-payment-area #payment .wc_payment_method > label::before {
    content:'';
    width:1.25rem;
    height:1.25rem;
    border-radius:50%;
    border:2px solid rgba(209,211,212,0.8);
    flex-shrink:0;
    transition:border-color 0.2s;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
}
#fxt-payment-area #payment .wc_payment_method.fxt-pm-active > label::before {
    border-color:#414042;
    background:radial-gradient(circle, #414042 35%, transparent 36%);
}

/* ── Pay button ──────────────────────────────────── */
.fxt-co-pay-btn {
    width:100%;
    background:#F3924D;
    color:#fff;
    border:none;
    padding:1.125rem 1.5rem;
    border-radius:0.875rem;
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:1rem;
    cursor:pointer;
    box-shadow:0 10px 15px -3px rgba(243,146,77,0.25);
    transition:background 0.2s;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0.5rem;
}
.fxt-co-pay-btn:hover { background:#e08442; }
.fxt-co-pay-btn:disabled { opacity:0.7; cursor:not-allowed; }
.fxt-co-summary .fxt-co-pay-btn { margin-top:1.5rem; }

/* ── Order Summary card ──────────────────────────── */
.fxt-co-summary {
    background:#fff;
    border:1px solid rgba(209,211,212,0.4);
    border-radius:2rem;
    padding:1.5rem;
    box-shadow:0 20px 25px -5px rgba(209,211,212,0.2);
}
.fxt-co-summary-head {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    margin-bottom:1rem;
}
.fxt-co-summary-title {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:1.375rem;
    color:#414042;
    margin:0;
}
.fxt-co-summary-count {
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    letter-spacing:0.1em;
    color:#9ca3af;
    font-weight:700;
}
.fxt-co-summary-items {
    display:flex;
    flex-direction:column;
    gap:0.75rem;
    margin-bottom:1rem;
}

/* Summary item */
.fxt-co-item { display:flex; align-items:center; gap:1rem; padding:0.5rem 0; }
.fxt-co-item-img {
    position:relative;
    width:4rem;
    height:4rem;
    border-radius:0.875rem;
    border:1px solid rgba(209,211,212,0.4);
    background:#F8F9FA;
    overflow:hidden;
    flex-shrink:0;
}
.fxt-co-item-img img { width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; opacity:0.9; }
.fxt-co-item-qty {
    position:absolute;
    top:-0.375rem;
    right:-0.375rem;
    width:1.25rem;
    height:1.25rem;
    background:#414042;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    font-weight:700;
    box-shadow:0 1px 3px rgba(0,0,0,0.2);
}
.fxt-co-item-info { flex:1; min-width:0; }
.fxt-co-item-name {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:0.875rem;
    color:#414042;
    margin-bottom:0.25rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.fxt-co-item-meta {
    font-family:'JetBrains Mono',monospace;
    font-size:0.7rem;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:#9ca3af;
}
.fxt-co-item-price {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:0.9375rem;
    color:#414042;
    flex-shrink:0;
}

.fxt-co-divider { width:100%; height:1px; background:rgba(209,211,212,0.4); margin:1.25rem 0; }

.fxt-co-totals { display:flex; flex-direction:column; gap:0.875rem; }
.fxt-co-total-row {
    display:flex;
    justify-content:space-between;
    font-family:'Roboto',sans-serif;
    font-size:0.875rem;
    color:#6b7280;
}
.fxt-co-total-row span:last-child { font-weight:500; color:#414042; }

.fxt-co-grand-total {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:1.25rem;
}
.fxt-co-gt-label {
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:1.25rem;
    color:#414042;
}
.fxt-co-gt-val {
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:1.875rem;
    color:#414042;
}

/* SSL badge */
.fxt-co-ssl-badge {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0.5rem;
    font-family:'JetBrains Mono',monospace;
    font-size:0.725rem;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:#9ca3af;
    font-weight:700;
    background:#F8F9FA;
    border:1px solid rgba(209,211,212,0.3);
    border-radius:0.875rem;
    padding:0.875rem;
}
.fxt-co-ssl-badge svg { width:0.75rem; height:0.75rem; color:#414042; }

/* ── Section gap (explicit so WC CSS can't override) ── */
.fxt-co-section {
    margin-bottom: 1.5rem !important;
}
.fxt-co-mobile-cta { margin-top: 0.5rem; }

/* ── Item image: allow badge to overflow ─────────────────── */
.fxt-co-item-img {
    overflow: visible !important;
}
.fxt-co-item-img img {
    border-radius: 0.75rem;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fxt-co-applied-coupon {
    display: flex;
    justify-content: space-between;
    font-family: 'Roboto',sans-serif;
    font-size: 0.8125rem;
    color: #6b7280;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(209,211,212,0.2);
}

/* ── WooCommerce form overrides ──────────────────── */
.fxt-checkout-page .woocommerce-form-row,
.fxt-checkout-page .form-row { margin:0 !important; padding:0 !important; }
.fxt-checkout-page select.country_to_state { width:100% !important; }

/* WC coupon/login notice (if any slip through) */
.fxt-co-notices .woocommerce-message,
.fxt-co-notices .woocommerce-error,
.fxt-co-notices .woocommerce-info {
    border-radius: 0.875rem;
    font-family: 'Roboto',sans-serif;
    font-size: 0.875rem;
}

/* --- SINGLE PAGE STYLES --- */
/* ── RESET & BASE ──────────────────────────────────────────── */
.fxt-pdp-wrap { background:#F8F9FA; }
.fxt-pdp-main { max-width:1280px; margin:0 auto; padding:3rem 2rem 5rem; }
@media(max-width:768px){ .fxt-pdp-main{ padding:2rem 1.25rem 3rem; } }

/* Breadcrumb */
.fxt-pdp-bc {
    display:flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.15em; text-transform:uppercase;
    color:#9ca3af; margin-bottom:2.5rem;
}
.fxt-pdp-bc a { color:inherit; text-decoration:none; transition:color .2s; }
.fxt-pdp-bc a:hover { color:#414042; }
.fxt-pdp-bc-sep { color:#D1D3D4; }

/* ── PRODUCT GRID ──────────────────────────────────────────── */
.fxt-pdp-grid {
    display:grid;
    grid-template-columns:2fr 3fr;
    gap:3rem;
    align-items:start;
    min-width:0;
}
@media(max-width:1024px){ .fxt-pdp-grid{ grid-template-columns:1fr; gap:2rem; } }
@media(max-width:767px){ .fxt-pdp-grid{ gap:1.5rem; } }

/* ── GALLERY (LEFT) ────────────────────────────────────────── */
/* Image on top, thumbnails below — always column */
.fxt-gallery {
    position:sticky; top:8rem;
    align-self:start;
    display:flex; flex-direction:column; gap:1rem;
    min-width:0;
}
@media(max-width:1024px){ .fxt-gallery{ position:relative; top:auto; } }

/* Main image — square, constrained size */
.fxt-main-img-wrap {
    width:100%;
    aspect-ratio:1/1;
    border-radius:2rem;
    background:#F8F9FA;
    border:1px solid rgba(209,211,212,.3);
    box-shadow:0 1px 3px rgba(0,0,0,.06);
    position:relative;
    overflow:hidden;
}

/* Thumbs — horizontal row below image */
.fxt-thumbs {
    display:flex;
    flex-direction:row;
    gap:10px;
    overflow-x:auto;
    padding-bottom:4px;
}

.fxt-thumb {
    width:72px; height:72px; flex-shrink:0;
    border-radius:10px;
    border:2px solid transparent;
    overflow:hidden;
    background:#F8F9FA;
    cursor:pointer;
    transition:border-color .2s;
    padding:0;
}
.fxt-thumb.active { border-color:#414042; }
.fxt-thumb:hover:not(.active) { border-color:rgba(209,211,212,.8); }
.fxt-thumb img {
    width:100%; height:100%; object-fit:cover;
    opacity:.7; transition:opacity .2s;
}
.fxt-thumb.active img, .fxt-thumb:hover img { opacity:1; }
.fxt-main-img-grid {
    position:absolute; inset:0;
    background-image:url("data:image/svg+xml,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cpattern id='g' width='40' height='40' patternUnits='userSpaceOnUse'%3E%3Cpath d='M40 0L0 0L0 40' fill='none' stroke='%23D1D3D4' stroke-width='.5'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23g)'/%3E%3C/svg%3E");
    opacity:.3;
}
.fxt-img-tag {
    position:absolute; z-index:2;
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.1em;
    color:#6b7280;
    background:rgba(255,255,255,.85);
    backdrop-filter:blur(4px);
    padding:4px 10px; border-radius:6px;
}
.fxt-img-tag-tl { top:16px; left:16px; }
.fxt-img-tag-br { bottom:16px; right:16px; }
#fxt-main-img {
    position:relative; z-index:1;
    width:100%; height:100%;
    object-fit:cover;
    transition:opacity .25s ease, transform .7s ease;
    padding:12px; border-radius:2rem;
}
.fxt-main-img-wrap:hover #fxt-main-img { transform:scale(1.04); }

/* ── PRODUCT INFO (RIGHT) ──────────────────────────────────── */
.fxt-pdp-info { display:flex; flex-direction:column; gap:1rem; min-width:0; }

/* Eyebrow */
.fxt-eyebrow {
    display:flex; align-items:center; gap:8px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.15em; text-transform:uppercase;
    color:#9ca3af; margin-bottom:.5rem;
}
.fxt-eyebrow-dot {
    width:6px; height:6px; border-radius:50%;
    background:#F3924D; flex-shrink:0;
}
.fxt-eyebrow-sep { color:#d1d3d4; font-weight:400; }
.fxt-product-code {
    font-family:'JetBrains Mono',monospace;
    font-size:11px; letter-spacing:.12em; text-transform:uppercase;
    color:#414042; font-weight:700;
    background:#f3f4f6; border-radius:4px;
    padding:2px 7px;
}

/* Title */
.fxt-pdp-info h1 {
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:clamp(0.75rem, 32px, 32px);
    line-height:1.1; letter-spacing:-.02em;
    color:#414042; margin:0 0 1rem;
}

/* Short desc */
.fxt-pdp-short-desc {
    font-family:'Roboto',sans-serif;
    font-size:14px; line-height:1.5; color:#6b7280;
    margin:0;
}

/* Price block */
.fxt-price-block {
    padding:0.7rem 0;
    border-top:1px solid rgba(209,211,212,.3);
    border-bottom:1px solid rgba(209,211,212,.3);
    display:flex; align-items:baseline; gap:1rem; flex-wrap:wrap;
}
.fxt-pdp-price {
    font-family:'Poppins',sans-serif;
    font-weight:300;
    font-size:2.5rem;
    letter-spacing:-.02em;
    color:#414042;
}
.fxt-pdp-price .woocommerce-Price-amount,
.fxt-pdp-price .woocommerce-Price-currencySymbol { font:inherit; color:inherit; }
.fxt-pdp-price ins { text-decoration:none; }
.fxt-price-meta {
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.15em; text-transform:uppercase;
    color:#9ca3af;
}

/* Section label */
.fxt-field-row {
    display:flex; justify-content:space-between; align-items:flex-end;
    margin-bottom:.75rem;
}
.fxt-field-label {
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:#9ca3af;
}
.fxt-field-val {
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#F3924D;
}
.fxt-size-chart-link {
    font-family:'JetBrains Mono',monospace;
    font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
    color:#414042; text-decoration:none; display:inline-flex; align-items:center; gap:3px;
    border-bottom:1px solid transparent; transition:border-color .15s, color .15s;
}
.fxt-size-chart-link:hover { border-bottom-color:#414042; color:#2a2a2b; }

/* Size nav buttons */
.fxt-size-grid {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:.75rem;
    overflow:hidden;
}
@media(max-width:480px){ .fxt-size-grid{ grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); } }
.fxt-size-btn {
    padding:.85rem .5rem;
    border:1px solid rgba(209,211,212,.5);
    border-radius:.75rem;
    text-align:center;
    background:#FFFFFF; color:#414042;
    cursor:pointer; text-decoration:none;
    transition:border-color .2s, background .2s, color .2s;
    display:block;
    outline:none;
}
/* Hover — border only */
.fxt-size-btn:hover:not(.active) {
    border-color:#414042;
    background:#FFFFFF;
    color:#414042;
}
.fxt-size-btn.active {
    border-color:#414042;
    background:#414042; color:#FFFFFF;
    box-shadow:0 4px 6px -1px rgba(0,0,0,.15);
}
.fxt-size-btn strong {
    display:block;
    font-family:'Poppins',sans-serif; font-weight:600; font-size:14px;
}
.fxt-size-btn span {
    display:block;
    font-family:'JetBrains Mono',monospace; font-size:12px;
    text-transform:uppercase; letter-spacing:.1em;
    color:#9ca3af; margin-top:4px;
}
.fxt-size-btn.active span { color:rgba(255,255,255,.6); }

/* Variation pack buttons */
.fxt-pack-grid {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); gap:.75rem 1.25rem;
    padding-top:.75rem;
}
@media(max-width:480px){ .fxt-pack-grid{ grid-template-columns:repeat(2,1fr); } }
.fxt-pack-btn {
    position:relative; overflow:visible; z-index:1;
    padding:1.25rem 0 0.55rem;
    border:1px solid rgba(209,211,212,.5);
    border-radius:.75rem;
    text-align:center;
    background:#FFFFFF !important;
    color:#414042 !important;
    cursor:pointer;
    transition:border-color .2s, background .2s, color .2s, box-shadow .2s;
    position:relative; overflow:hidden;
    outline:none !important;
    box-shadow:none;
    -webkit-appearance:none;
    appearance:none;
}
/* Hover — only border darkens, background stays white */
.fxt-pack-btn:hover:not(.active) {
    border-color:#414042 !important;
    background:#FFFFFF !important;
    color:#414042 !important;
}
/* Focus — no pink outline */
.fxt-pack-btn:focus,
.fxt-pack-btn:focus-visible {
    outline:none !important;
    box-shadow:0 0 0 2px rgba(65,64,66,.2) !important;
}
/* Active/selected — dark charcoal */
.fxt-pack-btn.active {
    border-color:#414042 !important;
    background:#414042 !important;
    color:#FFFFFF !important;
    box-shadow:0 4px 6px -1px rgba(0,0,0,.15) !important;
}
.fxt-pack-btn strong {
    display:block;
    font-family:'Poppins',sans-serif; font-weight:600; font-size:16px;
}
/* Price — bigger and clearly readable */
.fxt-pack-btn small {
    display:flex; align-items:center; justify-content:center; gap:4px; flex-wrap:wrap;
    font-family:'Poppins',sans-serif; font-weight:500; font-size:.85rem;
    margin-top:4px; color:#6b7280;
}
.fxt-pack-btn small .woocommerce-Price-amount,
.fxt-pack-btn small .woocommerce-Price-currencySymbol,
.fxt-pack-btn small bdi { font:inherit; color:inherit; }
.fxt-pack-btn small s { color:#9ca3af; font-weight:400; }
.fxt-pack-btn.active small { color:rgba(255,255,255,.75); }
.fxt-pack-btn.active small s { color:rgba(255,255,255,.45); }
.fxt-pack-save {
    position:absolute; top:-1px; right:-1px;
    background:#F3924D; color:#FFFFFF;
    font-family:'Poppins',sans-serif; font-weight:500; font-size:12px;
    padding:2px 8px; border-radius:0 .75rem 0 8px;
    z-index:2; white-space:nowrap;
}
@media(max-width:767px){
    .fxt-pack-save { font-size:10px; font-weight:500; padding:1px 6px; }
}

/* Hidden WooCommerce selects */
.fxt-hidden-selects { display:none !important; visibility:hidden !important; }

/* Qty adjuster + ATC row */
.fxt-atc-row { display:flex; gap:1rem; align-items:stretch; }

.fxt-qty-wrap {
    display:flex; align-items:center;
    border:1px solid rgba(209,211,212,.8);
    border-radius:.75rem; background:#FFFFFF;
    height:56px; flex-shrink:0;
}
.fxt-qty-btn {
    width:48px; height:100%;
    display:flex; align-items:center; justify-content:center;
    background:transparent; border:none; cursor:pointer;
    color:#414042; font-size:1.2rem;
    transition:background .2s;
}
.fxt-qty-btn:first-child { border-radius:.6rem 0 0 .6rem; }
.fxt-qty-btn:last-child  { border-radius:0 .6rem .6rem 0; }
.fxt-qty-btn:hover { background:#F8F9FA; }
.fxt-qty-num {
    width:40px !important; text-align:center;
    font-family:'JetBrains Mono',monospace; font-weight:500; color:#414042;
    font-size:.95rem;
    background:none; border:none !important; outline:none; box-shadow:none !important;
    padding:0 !important; margin:0; -moz-appearance:textfield;
}
.fxt-qty-num::-webkit-outer-spin-button,
.fxt-qty-num::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

.fxt-atc-submit {
    flex:1;
    background:#F3924D; color:#FFFFFF;
    border:none; border-radius:.75rem; height:56px;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:.875rem;
    cursor:pointer;
    transition:background .2s;
    box-shadow:0 10px 15px -3px rgba(243,146,77,.3);
    display:flex; align-items:center; justify-content:center; gap:.5rem;
}
.fxt-atc-submit:hover { background:#e08442; }
.fxt-atc-submit:disabled { background:#D1D3D4; box-shadow:none; cursor:not-allowed; }
/* Trust bar */
.fxt-trust-bar {
    display: flex; align-items: stretch;
    background: #414042;
    border-radius: 0.875rem;
    margin-top: 1rem;
    overflow: hidden;
}
.fxt-trust-item {
    display: flex; flex-direction: row; align-items: center;
    gap: 0.5rem; flex: 1; padding: 1rem 0.75rem;
    justify-content: center;
}
.fxt-trust-item + .fxt-trust-item {
    border-left: 1px solid rgba(255,255,255,0.1);
}
.fxt-trust-item svg {
    width: 1.125rem; height: 1.125rem;
    color: rgba(255,255,255,0.5); flex-shrink: 0;
}
.fxt-trust-item span {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem; font-weight: 500;
    letter-spacing: 0.05em;
    color: rgba(255,255,255,0.7); line-height: 1.3;
}
a.fxt-trust-link { text-decoration: none; }
a.fxt-trust-link:hover svg { color: #F3924D; }
a.fxt-trust-link:hover span { color: #F3924D; }
@media (max-width: 480px) {
    .fxt-trust-item { flex-direction: column; gap: 0.25rem; padding: 0.875rem 0.25rem; }
    .fxt-trust-item span { font-size: 0.625rem; text-align: center; }
}

.fxt-atc-error {
    margin-top:.75rem;
    padding:.75rem 1rem;
    background:#fff3f3;
    border:1px solid rgba(239,68,68,.25);
    border-radius:.75rem;
    font-family:'Roboto',sans-serif;
    font-size:.875rem;
    color:#b91c1c;
    line-height:1.5;
}

/* Specs grid */
.fxt-specs {
    display:grid; grid-template-columns:repeat(3,1fr);
    border-top:1px solid rgba(209,211,212,.3);
}
@media(max-width:480px){ .fxt-specs{ grid-template-columns:1fr 1fr; } }
.fxt-spec {
    padding:.875rem 1rem;
    border-bottom:1px solid rgba(209,211,212,.3);
}
.fxt-spec:nth-child(3n+1),
.fxt-spec:nth-child(3n+2) { border-right:1px solid rgba(209,211,212,.3); }
@media(max-width:480px){
    .fxt-spec:nth-child(3n+1),
    .fxt-spec:nth-child(3n+2) { border-right:none; }
    .fxt-spec:nth-child(odd)  { border-right:1px solid rgba(209,211,212,.3); }
}
.fxt-spec-lbl {
    font-family:'JetBrains Mono',monospace;
    font-size:11px; letter-spacing:.15em; text-transform:uppercase;
    color:#9ca3af; display:block; margin-bottom:4px;
}
.fxt-spec-val {
    font-family:'Roboto',sans-serif; font-size:.875rem;
    font-weight:500; color:#414042;
}

/* Accordions */
.fxt-accordions { border-top:1px solid rgba(209,211,212,.3); }
.fxt-acc details { border-bottom:1px solid rgba(209,211,212,.3); }
.fxt-acc summary {
    display:flex; justify-content:space-between; align-items:center;
    font-family:'Poppins',sans-serif; font-weight:500; font-size:1.1rem;
    color:#414042; cursor:pointer; padding:1.25rem 0;
    list-style:none; outline:none;
}
.fxt-acc summary:hover { background:rgba(209,211,212,0.18); border-radius:6px; padding-left:.75rem; padding-right:.75rem; margin-left:-.75rem; margin-right:-.75rem; }
.fxt-acc summary::-webkit-details-marker { display:none; }
.fxt-acc-icon {
    font-size:1.5rem; font-weight:300; line-height:1;
    color:#414042; transition:transform .25s ease;
    flex-shrink:0;
}
.fxt-acc details[open] .fxt-acc-icon { transform:rotate(45deg); }
.fxt-acc-body {
    font-family:'Roboto',sans-serif; font-size:14px;
    line-height:1.5; color:#6b7280;
    padding:0 1rem 1.5rem 0;
    overflow: hidden;
    transition: max-height 0.35s ease, opacity 0.35s ease;
    max-height: 0;
    opacity: 0;
}
.fxt-acc details[open] .fxt-acc-body {
    max-height: 600px;
    opacity: 1;
}
.fxt-acc-body a { color:#F3924D; font-weight:500; }
.fxt-acc-body a:hover { text-decoration:underline; }

/* Table inside accordion */
.fxt-acc-body table {
    width:100%; border-collapse:collapse;
    font-size:0.8125rem; margin:0.5rem 0 0.25rem;
}
.fxt-acc-body table th {
    font-family:'JetBrains Mono',monospace;
    font-size:0.6875rem; letter-spacing:0.1em; text-transform:uppercase;
    color:#9ca3af; font-weight:600;
    padding:0.625rem 0.875rem;
    background:#F8F9FA;
    border-bottom:2px solid rgba(209,211,212,0.5);
    text-align:left;
}
.fxt-acc-body table td {
    padding:0.625rem 0.875rem;
    border-bottom:1px solid rgba(209,211,212,0.3);
    color:#414042; vertical-align:top;
}
.fxt-acc-body table tr:last-child td { border-bottom:none; }
.fxt-acc-body table tr:hover td { background:rgba(243,146,77,0.04); }
.fxt-acc-body table td:first-child { font-weight:600; color:#414042; }

/* Variation notice */
.fxt-variation-notice {
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.1em; text-transform:uppercase;
    color:#F3924D; padding:.5rem 0;
}

/* Stock status */
.fxt-in-stock  { color:#16a34a; }
.fxt-low-stock { color:#F3924D; }
.fxt-out-stock { color:#dc2626; }

/* ── RELATED PRODUCTS ──────────────────────────────────────── */
.fxt-related { margin-top:3rem; padding-top:2.5rem; border-top:1px solid rgba(209,211,212,.3); }
.fxt-related-header { margin-bottom:2.5rem; }
.fxt-related-header .fxt-eyebrow { margin-bottom:.75rem; }
.fxt-related-header h2 {
    font-family:'Poppins',sans-serif; font-weight:800;
    font-size:clamp(1.5rem,3vw,2.25rem); color:#414042; margin:0;
}
.fxt-related-header h2 em { color:#F3924D; font-style:italic; }
.fxt-related-grid {
    display:grid; grid-template-columns:repeat(3,1fr); gap:2rem;
}
@media(max-width:1024px){ .fxt-related-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px) { .fxt-related-grid{ grid-template-columns:1fr; } }


/* WooCommerce override — hide default variation UI */
.woocommerce-variation-price,
.woocommerce-variation-availability { display:none; }

/* ── STAR RATING (below title) ─────────────────────────────── */
.fxt-star-display {
    display:flex; align-items:center; gap:10px; margin-bottom:.25rem;
}
.fxt-stars-row { display:flex; gap:2px; }
.fxt-star      { font-size:16px; line-height:1; color:#F3924D; }
.fxt-star.empty { color:#D1D3D4; }
.fxt-rating-text {
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:#9ca3af;
}

/* ── REVIEWS SECTION ───────────────────────────────────────── */
.fxt-reviews-section {
    margin-top:3rem; padding-top:2.5rem;
    border-top:1px solid rgba(209,211,212,.3);
}
.fxt-reviews-header { margin-bottom:2.5rem; }
.fxt-reviews-header h2 {
    font-family:'Poppins',sans-serif; font-weight:800;
    font-size:clamp(1.5rem,3vw,2.25rem); color:#414042; margin:0;
}
.fxt-reviews-header h2 em { color:#F3924D; font-style:italic; }

/* Reviews grid — 2 col when reviews exist, 1 col when none */
.fxt-reviews-grid {
    display:grid;
    grid-template-columns:2fr 3fr;
    gap:3rem;
    align-items:start;
}
.fxt-reviews-grid.no-reviews { grid-template-columns:1fr; }
@media(max-width:768px){ .fxt-reviews-grid{ grid-template-columns:1fr; } }

/* ── REVIEW FORM ────────────────────────────────────────────── */
.fxt-review-form-wrap {
    background:#FFFFFF;
    border-radius:1.5rem;
    border:1px solid rgba(209,211,212,.4);
    padding:2rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.fxt-review-form-wrap h3 {
    font-family:'Poppins',sans-serif; font-weight:700; font-size:1.1rem;
    color:#414042; margin:0 0 1.5rem;
}

/* Star selector */
.fxt-star-selector {
    display:flex; gap:4px; margin-bottom:1.25rem;
}
.fxt-star-sel-btn {
    font-size:26px; color:#D1D3D4; cursor:pointer;
    transition:color .1s; background:none; border:none; padding:0; line-height:1;
}
.fxt-star-sel-btn.lit { color:#F3924D; }

/* Form inputs */
.fxt-review-form input[type="text"],
.fxt-review-form input[type="email"],
.fxt-review-form textarea {
    width:100%;
    background:#F8F9FA;
    border:1px solid rgba(209,211,212,.5);
    border-radius:.75rem;
    padding:.75rem 1rem;
    font-family:'Roboto',sans-serif; font-size:.875rem;
    color:#414042;
    outline:none;
    transition:border-color .2s;
    margin-bottom:.875rem;
    display:block;
    box-sizing:border-box;
}
.fxt-review-form input:focus,
.fxt-review-form textarea:focus { border-color:#F3924D; }
.fxt-review-form textarea { min-height:110px; resize:vertical; }
.fxt-review-form input::placeholder,
.fxt-review-form textarea::placeholder { color:#9ca3af; }

.fxt-review-submit {
    width:100%;
    background:#414042; color:#FFFFFF;
    border:none; border-radius:.75rem;
    padding:.875rem;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:.875rem;
    cursor:pointer; transition:background .2s;
}
.fxt-review-submit:hover { background:#000; }

/* Success message */
.fxt-review-success {
    background:#f0fdf4; border:1px solid #86efac;
    border-radius:.75rem; padding:1rem 1.25rem;
    font-family:'Poppins',sans-serif; font-size:.875rem; color:#166534;
    display:none;
}

/* ── EXISTING REVIEWS ───────────────────────────────────────── */
.fxt-reviews-list { display:flex; flex-direction:column; gap:1.5rem; }

.fxt-review-card {
    background:#FFFFFF;
    border-radius:1.25rem;
    border:1px solid rgba(209,211,212,.4);
    padding:1.5rem;
    box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.fxt-review-top {
    display:flex; justify-content:space-between; align-items:flex-start;
    margin-bottom:.75rem;
}
.fxt-reviewer-name {
    font-family:'Poppins',sans-serif; font-weight:700; font-size:.95rem; color:#414042;
    display:block;
}
.fxt-review-date {
    font-family:'JetBrains Mono',monospace; font-size:11px;
    letter-spacing:.1em; text-transform:uppercase; color:#9ca3af;
    display:block; margin-top:3px;
}
.fxt-review-stars { display:flex; gap:2px; }
.fxt-review-text {
    font-family:'Roboto',sans-serif; font-size:.875rem;
    line-height:1.7; color:#6b7280; margin:0;
}

/* Show more */
.fxt-review-card.fxt-hidden-review { display:none; }
.fxt-show-more-wrap { text-align:center; padding-top:1rem; }
.fxt-show-more-btn {
    background:transparent;
    border:1px solid rgba(209,211,212,.6);
    border-radius:.75rem;
    padding:.625rem 1.5rem;
    font-family:'JetBrains Mono',monospace;
    font-size:12px; letter-spacing:.12em; text-transform:uppercase;
    color:#414042; cursor:pointer; transition:border-color .2s, background .2s;
}
.fxt-show-more-btn:hover { border-color:#414042; background:#F8F9FA; }

/* No reviews yet label */
.fxt-no-reviews-yet {
    font-family:'Roboto',sans-serif; font-size:.875rem;
    color:#9ca3af; font-style:italic; text-align:center;
    padding:2rem; border:1px dashed rgba(209,211,212,.6); border-radius:1rem;
}

/* --- ARCHIVE PAGE STYLES --- */
/* ── SHOP LAYOUT ────────────────────────────────────────── */
.fxt-shop-wrap {
    background: #F8F9FA;
    min-height: 100vh;
}

/* Page header */
.fxt-page-header {
    background: #FFFFFF;
    padding: 3rem 0;
    border-bottom: 1px solid rgba(209,211,212,0.2);
    position: relative;
    overflow: hidden;
}
.fxt-page-header::before {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 384px; height: 384px;
    background: #F3924D;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.10;
    pointer-events: none;
}

/* Container */
.fxt-con {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 2rem;
}

/* Breadcrumb */
.fxt-bc {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #9ca3af;
    margin-bottom: 3rem;
}
.fxt-bc a { color: inherit; text-decoration: none; }
.fxt-bc a:hover { color: #414042; }
.fxt-bc-sep { color: #D1D3D4; }

/* Breadcrumb on PDP — above gallery image, tighter margin */
.fxt-pdp-bc { margin-bottom: 0.75rem; }

/* Header title grid */
.fxt-hdr-grid {
    display: grid;
    grid-template-columns: 7fr 5fr;
    gap: 4rem;
    align-items: end;
}
@media (max-width: 768px) {
    .fxt-hdr-grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .fxt-page-header { padding: 2.5rem 0; }
}

.fxt-orange-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #F3924D;
    margin-bottom: 1rem;
}
.fxt-orange-label::before {
    content: '';
    width: 6px; height: 6px;
    background: #F3924D;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.fxt-page-header h1 {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: clamp(2.25rem, 4vw, 3.75rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #414042;
    margin: 0;
}
.fxt-page-header h1 em {
    color: #F3924D;
    font-style: italic;
    display: inline-block;
    margin-top: 8px;
}

.fxt-hdr-desc {
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    color: #6b7280;
    max-width: 400px;
}

/* ── SHOP SECTION ─────────────────────────────────────── */
.fxt-shop-section {
    padding: 3rem 0 5rem;
}

/* Filter bar */
.fxt-filter-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(209,211,212,0.3);
    margin-bottom: 3rem;
}

.fxt-filter-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.fxt-tab {
    padding: 10px 20px;
    border-radius: 999px;
    border: 1px solid rgba(209,211,212,0.6);
    background: transparent;
    color: #414042;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: .15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .2s ease;
    white-space: nowrap;
}
.fxt-tab:hover { border-color: #414042; background: transparent; color: #414042; }
.fxt-tab.active {
    background: #414042;
    color: #FFFFFF;
    border-color: #414042;
}
.fxt-tab-count { opacity: 0.5; margin-left: 4px; }

/* Sort dropdown */
.fxt-sort-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #6b7280;
    background: #FFFFFF;
    padding: 10px 16px;
    border-radius: 12px;
    border: 1px solid rgba(209,211,212,0.5);
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.fxt-sort-wrap select {
    background: transparent;
    border: none;
    color: #414042;
    font-family: inherit;
    font-size: inherit;
    font-weight: 600;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    outline: none;
    appearance: none;
    padding-right: 16px;
}

/* ── PRODUCT GRID ─────────────────────────────────────── */
.fxt-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}
@media (max-width: 1024px) { .fxt-product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .fxt-product-grid { grid-template-columns: 1fr; } }

/* Product card */
.fxt-product-card {
    background: #FFFFFF;
    border-radius: 2rem;
    border: 1px solid rgba(209,211,212,0.4);
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .3s cubic-bezier(.175,.885,.32,1.275), box-shadow .3s ease;
}
.fxt-product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.10), 0 10px 10px -5px rgba(0,0,0,0.04);
}
.fxt-product-card.fxt-hidden { display: none; }

/* Card image */
.fxt-card-img {
    display: block;
    position: relative;
    aspect-ratio: 1 / 1;
    background: #F8F9FA;
    overflow: hidden;
    text-decoration: none;
    padding: 0.4rem;
    border-radius: 2rem 2rem 0 0;
    border-bottom: none;
}
.fxt-card-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .7s ease;
    display: block;
    border-radius: 1.5rem 1.5rem 0.5rem 0.5rem;
}
.fxt-product-card:hover .fxt-card-img img {
    transform: scale(1.05);
}

/* Badge */
.fxt-badge {
    position: absolute;
    top: 16px; left: 16px;
    z-index: 10;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 6px;
    color: #FFFFFF;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.fxt-badge-orange { background: #F3924D; }
.fxt-badge-dark   { background: #414042; }

/* Card body */
.fxt-card-body {
    padding: 1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.fxt-card-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #9ca3af;
    margin-bottom: 4px;
    display: block;
}

.fxt-card-body h3 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 1.2rem;
    color: #414042;
    margin: 0 0 auto 0;
    padding-bottom: 0.625rem;
}
.fxt-card-body h3 a {
    color: inherit;
    text-decoration: none;
    transition: color .2s;
}
.fxt-card-body h3 a:hover { color: #F3924D; }

/* Card footer */
.fxt-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 1rem;
    border-top: 1px solid rgba(209,211,212,0.3);
    margin-top: auto;
}

.fxt-price-wrap { display: flex; flex-direction: column; }

.fxt-price {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 1.125rem;
    color: #414042;
    display: block;
}
/* Override WooCommerce price span styling */
.fxt-price .woocommerce-Price-amount,
.fxt-price .woocommerce-Price-currencySymbol {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
}

.fxt-pack {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #9ca3af;
    display: block;
    margin-top: 3px;
}

/* Add to cart button */
.fxt-atc-btn {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #F8F9FA;
    color: #414042;
    border: 1px solid rgba(209,211,212,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
    text-decoration: none;
    flex-shrink: 0;
}
.fxt-atc-btn:hover {
    background: #F3924D;
    color: #FFFFFF;
    border-color: #F3924D;
}
.fxt-atc-btn svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
}

/* Arrow button — used on related/upsell cards as link indicator */
.fxt-card-arrow {
    width: 2.5rem; height: 2.5rem; border-radius: 0.75rem;
    background: #F8F9FA; color: #414042;
    border: 1px solid rgba(209,211,212,0.5);
    display: flex; align-items: center; justify-content: center;
    transition: background 0.2s, color 0.2s;
    flex-shrink: 0;
}
.fxt-card-arrow svg { width: 1.125rem; height: 1.125rem; }
.fxt-product-card:hover .fxt-card-arrow { background: #414042; color: #fff; }
.fxt-product-card:hover .fxt-card-body h3 a { color: #F3924D; }

/* No products message */
.fxt-no-products {
    text-align: center;
    padding: 4rem 2rem;
    color: #6b7280;
    font-family: 'Poppins', sans-serif;
}
.fxt-no-products a { color: #F3924D; }

/* --- THANKYOU PAGE STYLES --- */
/* ── Base ─────────────────────────────────────────────────── */
body.fxt-order-received-page { background:#F8F9FA; }
body.fxt-order-received-page .elementor-location-footer,
body.fxt-order-received-page footer.site-footer,
body.fxt-order-received-page #colophon { display:none !important; }
body.fxt-order-received-page *,
body.fxt-order-received-page *::before,
body.fxt-order-received-page *::after { box-sizing:border-box; }
.fxt-or-container { max-width:1280px; margin:0 auto; padding:0 1rem; box-sizing:border-box; width:100%; }
@media(min-width:640px) { .fxt-or-container { padding:0 1.5rem; } }
@media(min-width:1024px){ .fxt-or-container { padding:0 2rem; } }
.fxt-or-main { overflow-x:hidden; }

/* ── Notices ──────────────────────────────────────────────── */
.fxt-or-notices-inner { max-width:1280px; margin:0 auto; padding:1rem 2rem; }

/* ── Hero ─────────────────────────────────────────────────── */
.fxt-or-hero {
    position:relative;
    padding:2rem 0 1.5rem;
    text-align:center;
    background:#F8F9FA;
    border-bottom:1px solid rgba(209,211,212,0.2);
    overflow:hidden;
}
@media(min-width:1024px){ .fxt-or-hero { padding:2.5rem 0 2rem; } }

.fxt-or-hero-bg {
    position:absolute;
    top:0; left:50%; transform:translateX(-50%);
    width:100%; height:100%;
    background:radial-gradient(circle at top center, rgba(243,146,77,0.12) 0%, transparent 65%);
    pointer-events:none;
    z-index:0;
}
.fxt-or-hero-inner { position:relative; z-index:1; }

/* Animated checkmark */
.fxt-or-check-wrap { display:flex; justify-content:center; margin-bottom:1rem; }
.fxt-or-check {
    width:5rem; height:5rem;
    border-radius:50%;
    background:#F3924D;
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 0 0 12px rgba(243,146,77,0.15);
    opacity:0;
    transform:scale(0.4);
    transition:none;
}
.fxt-or-check.fxt-or-check-animate {
    animation:fxtOrPop 0.6s cubic-bezier(0.2,0.7,0.2,1) forwards;
}
.fxt-or-check svg { width:2.5rem; height:2.5rem; }
@media(min-width:768px){ .fxt-or-check { width:6rem; height:6rem; } .fxt-or-check svg { width:3rem; height:3rem; } }

@keyframes fxtOrPop {
    0%   { transform:scale(0.4); opacity:0; }
    60%  { transform:scale(1.1); }
    100% { transform:scale(1); opacity:1; }
}

/* Step label */
.fxt-or-step-label {
    display:inline-flex; align-items:center; gap:0.5rem;
    font-family:'JetBrains Mono',monospace;
    font-size:0.75rem; letter-spacing:0.15em; text-transform:uppercase;
    color:#F3924D; font-weight:700; margin-bottom:1.5rem;
}
.fxt-or-step-dot {
    width:0.375rem; height:0.375rem;
    background:#F3924D; border-radius:50%; display:inline-block; flex-shrink:0;
}

/* Hero heading */
.fxt-or-hero-title {
    font-family:'Poppins',sans-serif;
    font-weight:800;
    font-size:clamp(1.75rem,4vw,2.75rem);
    letter-spacing:-0.02em;
    color:#414042;
    line-height:1.1;
    margin:0 0 1rem;
}
.fxt-or-hero-name {
    color:#F3924D;
    font-style:italic;
    display:inline-block;
    margin-top:0.25rem;
}
.fxt-or-hero-sub {
    font-family:'Roboto',sans-serif;
    font-size:1.0625rem;
    color:#6b7280;
    line-height:1.7;
    max-width:36rem;
    margin:0 auto 1.25rem;
}
@media(min-width:768px){ .fxt-or-hero-sub { font-size:1.25rem; } }

/* Meta bar */
.fxt-or-meta-bar {
    display:flex; flex-wrap:wrap; align-items:center;
    gap:0.5rem 1rem;
    justify-content:center;
    background:#fff;
    border:1px solid rgba(209,211,212,0.5);
    border-radius:1.25rem;
    padding:0.875rem 1.25rem;
    box-shadow:0 1px 4px rgba(0,0,0,0.04);
    font-family:'JetBrains Mono',monospace;
    font-size:14px; letter-spacing:0.08em; text-transform:uppercase; color:#9ca3af;
    max-width:100%;
}
.fxt-or-meta-bar strong { color:#414042; }
.fxt-or-meta-sep {
    width:0.25rem; height:0.25rem;
    background:#D1D3D4; border-radius:50%;
    display:none;
}
@media(min-width:640px){ .fxt-or-meta-sep { display:inline-block; } }

/* ── Main grid ────────────────────────────────────────────── */
.fxt-or-main { padding:3rem 0 5rem; }
.fxt-or-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:2rem;
    align-items:start;
}
@media(min-width:1024px){
    .fxt-or-grid { grid-template-columns:7fr 5fr; }
    .fxt-or-right { position:sticky; top:7rem; align-self:flex-start; }
}

/* ── Cards ────────────────────────────────────────────────── */
.fxt-or-card {
    background:#fff;
    border:1px solid rgba(209,211,212,0.4);
    border-radius:2rem;
    padding:1.25rem;
    box-shadow:0 1px 4px rgba(0,0,0,0.04);
}
@media(min-width:640px){ .fxt-or-card { padding:2.5rem; border-radius:2.5rem; } }
.fxt-or-card-title {
    font-family:'Poppins',sans-serif;
    font-weight:700; font-size:1.5rem; color:#414042;
    margin:0 0 2rem;
}

/* ── Order items ──────────────────────────────────────────── */
.fxt-or-items { display:flex; flex-direction:column; gap:1.5rem; margin-bottom:2rem; }
.fxt-or-item {
    display:flex; align-items:center; gap:1rem;
    padding-bottom:1.5rem;
    border-bottom:1px solid rgba(209,211,212,0.3);
}
.fxt-or-item:last-child { border-bottom:none; padding-bottom:0; }
.fxt-or-item-img {
    position:relative; width:5rem; height:5rem;
    border-radius:1rem;
    border:1px solid rgba(209,211,212,0.4);
    background:#F8F9FA;
    overflow:visible; flex-shrink:0;
}
.fxt-or-item-img img {
    width:100%; height:100%;
    object-fit:cover; border-radius:1rem;
    mix-blend-mode:multiply; opacity:0.9;
}
@media(min-width:640px){ .fxt-or-item-img { width:6rem; height:6rem; } }
.fxt-or-item-qty {
    position:absolute; top:-0.5rem; right:-0.5rem;
    width:1.375rem; height:1.375rem;
    background:#414042; color:#fff;
    border-radius:50%; border:2px solid #fff;
    display:flex; align-items:center; justify-content:center;
    font-family:'JetBrains Mono',monospace; font-size:0.75rem; font-weight:700;
}
.fxt-or-item-info { flex:1; min-width:0; }
.fxt-or-item-name {
    display:block;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:0.9375rem; color:#414042;
    text-decoration:none; margin-bottom:0.375rem;
    overflow:hidden; text-overflow:ellipsis;
    transition:color 0.2s;
}
.fxt-or-item-name:hover { color:#F3924D; }
.fxt-or-item-meta, .fxt-or-item-sku {
    font-family:'JetBrains Mono',monospace;
    font-size:0.6875rem; letter-spacing:0.15em; text-transform:uppercase; color:#9ca3af;
    margin-top:0.25rem;
}
.fxt-or-item-price {
    font-family:'Poppins',sans-serif; font-weight:700; font-size:1rem; color:#414042;
    flex-shrink:0; text-align:right;
}

/* ── Totals ───────────────────────────────────────────────── */
.fxt-or-divider { height:1px; background:rgba(209,211,212,0.4); margin:1.25rem 0; }
.fxt-or-totals { display:flex; flex-direction:column; gap:0.875rem; }
.fxt-or-total-row {
    display:flex; justify-content:space-between;
    font-family:'Roboto',sans-serif; font-size:0.875rem; color:#6b7280;
}
.fxt-or-total-row span:last-child { font-weight:500; color:#414042; }
.fxt-or-total-discount span:first-child { color:#16a34a; }
.fxt-or-total-discount span:last-child { color:#16a34a; }
.fxt-or-coupon-code {
    font-family:'JetBrains Mono',monospace; font-size:0.6875rem;
    letter-spacing:0.1em; background:rgba(22,163,74,0.1);
    padding:0.125rem 0.375rem; border-radius:0.25rem; margin-left:0.375rem;
}
.fxt-or-shipping-method { color:#9ca3af; font-size:0.8125rem; }
.fxt-or-grand-total {
    display:flex; justify-content:space-between; align-items:center;
    padding-top:0.75rem;
}
.fxt-or-grand-total > span:first-child {
    font-family:'Poppins',sans-serif; font-weight:700; font-size:1.25rem; color:#414042;
}
.fxt-or-gt-val {
    font-family:'Poppins',sans-serif; font-weight:800; font-size:2rem; color:#414042;
}

/* ── Customer details grid ─────────────────────────────────── */
.fxt-or-details-grid {
    display:grid; grid-template-columns:1fr;
    gap:1.5rem; margin-top:2rem;
    padding:1.5rem; background:#F8F9FA;
    border:1px solid rgba(209,211,212,0.3); border-radius:1.25rem;
}
@media(min-width:640px){ .fxt-or-details-grid { grid-template-columns:1fr 1fr; } }
.fxt-or-card-brand-icon { height:20px; width:auto; vertical-align:middle; margin-right:0.35rem; display:inline-block; }
.fxt-or-details-label {
    font-family:'JetBrains Mono',monospace;
    font-size:0.6875rem; letter-spacing:0.15em; text-transform:uppercase;
    color:#9ca3af; font-weight:700; margin-bottom:0.625rem;
}
.fxt-or-details-val {
    font-family:'Roboto',sans-serif; font-size:0.875rem; color:#414042; line-height:1.7;
}
.fxt-or-payment-badge {
    display:inline-block;
    border:1px solid rgba(209,211,212,0.6);
    background:#fff; border-radius:0.375rem;
    padding:0.25rem 0.625rem;
    font-family:'JetBrains Mono',monospace; font-size:0.6875rem;
    letter-spacing:0.1em; text-transform:uppercase; color:#6b7280;
}
.fxt-or-billing-email { font-size:0.8125rem; color:#6b7280; margin-top:0.25rem; }

/* ── Gateway output ───────────────────────────────────────── */
.fxt-or-gateway-msg {
    background:#fff3e0; border:1px solid rgba(243,146,77,0.3);
    border-radius:1rem; padding:1.25rem 1.5rem; margin-bottom:1.5rem;
    font-family:'Roboto',sans-serif; font-size:0.875rem; color:#414042;
}

/* ── Timeline card ────────────────────────────────────────── */
.fxt-or-timeline-card {
    background:#fff;
    border:1px solid rgba(209,211,212,0.4);
    border-radius:2.5rem;
    padding:2.5rem;
    box-shadow:0 20px 25px -5px rgba(209,211,212,0.2);
}
.fxt-or-timeline {
    position:relative;
    display:flex; flex-direction:column;
    gap:0;
    margin-bottom:2rem;
}
.fxt-or-timeline::before {
    content:''; position:absolute;
    left:1.3rem; top:0; bottom:0; width:1px;
    background:rgba(209,211,212,0.5); z-index:0;
}

/* Step */
.fxt-or-step {
    display:flex; gap:1.5rem;
    padding-bottom:2rem; position:relative; z-index:1;
}
.fxt-or-step:last-child { padding-bottom:0; }
.fxt-or-step-icon {
    width:2.75rem; height:2.75rem;
    border-radius:50%;
    border:3px solid #fff;
    display:flex; align-items:center; justify-content:center;
    font-family:'JetBrains Mono',monospace; font-size:0.75rem; font-weight:700;
    flex-shrink:0;
    background:#F8F9FA; color:#D1D3D4;
    box-shadow:0 0 0 2px rgba(209,211,212,0.5);
}
.fxt-or-step-icon svg { width:1.125rem; height:1.125rem; }

.fxt-or-step-done .fxt-or-step-icon,
.fxt-or-step-icon-done {
    background:#F3924D !important; color:#fff !important;
    box-shadow:0 0 0 3px rgba(243,146,77,0.2) !important;
}
.fxt-or-step-active .fxt-or-step-icon,
.fxt-or-step-icon-active {
    background:#414042 !important; color:#fff !important;
    box-shadow:0 0 0 3px rgba(65,64,66,0.15) !important;
}

.fxt-or-step-body { flex:1; min-width:0; }
.fxt-or-step-body h4 {
    font-family:'Poppins',sans-serif; font-weight:700; font-size:1rem;
    color:#414042; margin:0 0 0.375rem;
}
.fxt-or-step-pending .fxt-or-step-body h4 { color:#9ca3af; }
.fxt-or-step-body p {
    font-family:'Roboto',sans-serif; font-size:0.8125rem; color:#6b7280; margin:0 0 0.5rem;
}
.fxt-or-step-pending .fxt-or-step-body p { color:#D1D3D4; }
.fxt-or-step-time {
    font-family:'JetBrains Mono',monospace;
    font-size:0.6875rem; letter-spacing:0.15em; text-transform:uppercase;
    color:#D1D3D4; font-weight:700;
}
.fxt-or-step-time-done { color:#9ca3af; }
.fxt-or-step-time-active { color:#F3924D; }

/* ── Action buttons ───────────────────────────────────────── */
.fxt-or-timeline-actions {
    display:flex; flex-direction:column; gap:0.75rem;
    padding-top:2rem;
    border-top:1px solid rgba(209,211,212,0.4);
}
.fxt-or-btn-primary {
    display:flex; align-items:center; justify-content:center;
    background:#414042; color:#fff;
    padding:1rem 1.5rem; border-radius:0.875rem;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:0.875rem;
    text-decoration:none; text-align:center;
    transition:background 0.2s;
}
.fxt-or-btn-primary:hover { background:#000; color:#fff; }
.fxt-or-btn-ghost {
    display:flex; align-items:center; justify-content:center;
    background:#fff; color:#414042;
    border:1px solid rgba(209,211,212,0.8);
    padding:1rem 1.5rem; border-radius:0.875rem;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:0.875rem;
    text-decoration:none; text-align:center;
    transition:border-color 0.2s;
}
.fxt-or-btn-ghost:hover { border-color:#414042; color:#414042; }

/* ── B2B repeat order nudge ───────────────────────────────── */
.fxt-or-b2b {
    padding: 3rem 0;
    background: #414042;
    border-top: 1px solid rgba(255,255,255,0.06);
}
.fxt-or-b2b-inner {
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}
.fxt-or-b2b-copy { flex: 1; min-width: 200px; }
.fxt-or-b2b-eyebrow {
    display: inline-flex; align-items: center; gap: 0.5rem;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.6875rem; letter-spacing: 0.12em;
    text-transform: uppercase; color: #F3924D;
    font-weight: 700; margin-bottom: 0.5rem;
}
.fxt-or-b2b-eyebrow .fxt-or-step-dot { background: #F3924D; }
.fxt-or-b2b-title {
    font-family: 'Poppins', sans-serif; font-weight: 700;
    font-size: 1.5rem; color: #fff;
    margin: 0 0 0.5rem; letter-spacing: -0.01em;
}
.fxt-or-b2b-sub {
    font-family: 'Roboto', sans-serif; font-size: 1rem;
    color: #D1D3D4; line-height: 1.6; margin: 0;
}
.fxt-or-b2b-actions {
    display: flex; flex-direction: column; gap: 0.625rem;
    flex-shrink: 0; min-width: 200px;
}
.fxt-or-b2b-btn-primary {
    display: inline-flex; align-items: center; justify-content: center;
    background: #F3924D; color: #fff;
    font-family: 'Poppins', sans-serif; font-weight: 700;
    font-size: 0.875rem; padding: 0.75rem 1.5rem;
    border-radius: 0.75rem; text-decoration: none;
    transition: background 0.2s; white-space: nowrap;
}
.fxt-or-b2b-btn-primary:hover { background: #e08442; color: #fff; }
.fxt-or-b2b-btn-ghost {
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent; color: #D1D3D4;
    font-family: 'Poppins', sans-serif; font-weight: 600;
    font-size: 0.8125rem; padding: 0.625rem 1.5rem;
    border-radius: 0.75rem; text-decoration: none;
    border: 1px solid #D1D3D4;
    transition: border-color 0.2s, color 0.2s; white-space: nowrap;
}
.fxt-or-b2b-btn-ghost:hover { border-color: #fff; color: #fff; }
@media(max-width:767px) {
    .fxt-or-b2b-inner { flex-direction: column; align-items: flex-start; }
    .fxt-or-b2b-actions { flex-direction: row; flex-wrap: wrap; width: 100%; }
}

/* ── Upsell section ───────────────────────────────────────── */
.fxt-or-upsell {
    padding:5rem 0 6rem;
    background:#fff;
    border-top:1px solid rgba(209,211,212,0.3);
}
.fxt-or-upsell-head { margin-bottom:3rem; }
.fxt-or-upsell-label {
    display:inline-flex; align-items:center; gap:0.5rem;
    font-family:'JetBrains Mono',monospace;
    font-size:0.75rem; letter-spacing:0.15em; text-transform:uppercase;
    color:#F3924D; font-weight:700; margin-bottom:1rem;
}
.fxt-or-upsell-title {
    font-family:'Poppins',sans-serif; font-weight:800;
    font-size:clamp(1.875rem,4vw,3rem); color:#414042;
    letter-spacing:-0.025em; line-height:1.15; margin:0 0 1rem;
}
.fxt-or-upsell-title em { color:#F3924D; font-style:italic; }
.fxt-or-upsell-sub {
    font-family:'Roboto',sans-serif; font-size:1rem; color:#6b7280;
    max-width:32rem; line-height:1.7;
}
.fxt-or-upsell-grid {
    display:grid; grid-template-columns:1fr; gap:2rem;
}
@media(min-width:640px){ .fxt-or-upsell-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .fxt-or-upsell-grid { grid-template-columns:repeat(3,1fr); } }


/* ── Failed order state ───────────────────────────────────── */
.fxt-or-failed-wrap { padding:8rem 0 5rem; }
.fxt-or-failed-card {
    max-width:36rem; margin:0 auto; text-align:center;
    background:#fff; border:1px solid rgba(209,211,212,0.4);
    border-radius:2rem; padding:3rem 2rem;
}
.fxt-or-failed-icon {
    width:4rem; height:4rem; margin:0 auto 1.5rem;
    border-radius:50%; background:#fee2e2; color:#ef4444;
    display:flex; align-items:center; justify-content:center;
    font-size:1.5rem; font-weight:800;
}
.fxt-or-failed-card h1 {
    font-family:'Poppins',sans-serif; font-weight:800; font-size:1.75rem; color:#414042; margin:0 0 1rem;
}
.fxt-or-failed-card p { font-family:'Roboto',sans-serif; color:#6b7280; margin:0 0 2rem; }
.fxt-or-failed-actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

/* ── WC overrides on this page ────────────────────────────── */
.fxt-order-received-page .woocommerce-Price-amount bdi { display:inline !important; }
.fxt-order-received-page .woocommerce-order { display:none; }

/* ==========================================================================
   GLOBAL RESPONSIVE FIX (Mobile Spacing)
   ========================================================================== */
.fxt-main-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .fxt-main-container {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
    html, body {
        overflow-x: hidden;
        width: 100%;
        position: relative;
    }
}

/* ==========================================================================
   CUSTOM OVERRIDES (Buttons, Hover States, Elementor Shadows)
   ========================================================================== */
div.herotag p,
.herotags {
    font-size: 12px !important;
    text-align: center !important;
}



.fxt-tab:hover {
    border: 1px #414042 solid !important;
    background: transparent !important;
    color: #414042;
}


.fxt-co-coupon-btn {
    background-color: #414042 !important;
    color: #ffffff !important;
}



.elementor-element-hero-big {
    --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.343);
    --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.elementor-element-hero-small {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.2), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* Scope fix: Taake baqi site ke elements kharab na hon */
.elementor-element-hero-small::after, 
.elementor-element-hero-small::before,
.elementor-element-hero-big::after, 
.elementor-element-hero-big::before {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}

/* ==========================================================================
   QUANTITY BUTTONS RESET (Prevents full-width stretch)
   ========================================================================== */

/* Target all quantity buttons in Shop, Cart, and Mini-cart */
.quantity .minus,
.quantity .plus,
.quantity button.minus,
.quantity button.plus,
.fxt-qty-btn,
.fxt-drawer-qty-btn {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex: 0 0 auto !important;
}

/* Ensure the input number box is also sized correctly */
.quantity input.qty {
    width: 50px !important;
    height: 40px !important;
    text-align: center !important;
    padding: 0 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0 !important; /* Keeps it flush with buttons */
}

@media (max-width: 767px) {
    .longimagecontainer {
        height: 380px !important;
    }
    .second-container-hero {
        height: 190px !important;
    }
    .units-shipped {
        height: 160px !important;
    }
}