/*
Theme Name: QuickTheme
Theme URI: https://wpquickform.com
Author: QuickTheme
Author URI: https://wpquickform.com
Description: Ultra-lightweight WordPress theme optimized for COD (Cash on Delivery) sellers. Built for speed with minimal CSS, JS, and HTML. Integrates seamlessly with QuickFORM for instant checkout.
Version: 1.7
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: quicktheme
Tags: e-commerce, woocommerce, lightweight, fast, cod, checkout

QuickTheme is a minimal, high-performance theme designed for COD sellers.
*/

:root {
    --primary-color: #17a2b8;
    --primary-color-hover: #138496;
    --header-top-bg: var(--primary-color);
    --header-top-text: #ffffff;
    --font-body: "IBM Plex Sans Arabic", "Noto Sans Arabic", Tahoma, Arial, sans-serif;
    --font-headings: "IBM Plex Sans Arabic", "Noto Sans Arabic", Tahoma, Arial, sans-serif;
    --font-weight-body: 400;
    --font-weight-headings: 700;
    /* Corner radius: overridden in Customizer (QuickTheme — Apparence → Rayon des coins) */
    --theme-radius: 8px;
    --theme-radius-sm: 4px;
    --theme-radius-md: 6px;
    --theme-radius-lg: 12px;
    --theme-radius-xl: 16px;
    /* Align with QuickFORM shells; follows theme radius when Customizer CSS loads */
    --qt-field-radius: var(--theme-radius);
    --qt-field-shadow: -2px 5px 12.9px -9px rgba(157, 157, 157, 0.81);
    /* Shared show/hide reveal — reuse for banners, notices, expand panels */
    --qt-reveal-duration: 0.35s;
    --qt-reveal-ease: ease;
    --qt-reveal-distance: 6px;
}

/* ============================================
   CSS Reset & Base Styles
   ============================================ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
    /* Prevent horizontal scroll */
}

body {
    font-family: var(--font-body);
    font-weight: var(--font-weight-body);
    line-height: 1.6;
    color: #333;
    background: #fff;
    font-variant-numeric: normal;
    overflow-x: hidden;
    /* Prevent horizontal scroll */
}

body.menu-open {
    overflow: hidden;
}

/* Headings use bold */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-headings);
    font-weight: var(--font-weight-headings);
    line-height: 1.3em;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

/* Description, short description & header nav: theme color + center-expand underline */
.woocommerce-product-details__short-description a,
.woocommerce-Tabs-panel--description a,
#tab-description a,
.main-navigation .nav-menu > li > a {
    position: relative;
    display: inline-block;
    transition: color 0.2s ease;
}

.woocommerce-product-details__short-description a::after,
.woocommerce-Tabs-panel--description a::after,
#tab-description a::after,
.main-navigation .nav-menu > li > a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    pointer-events: none;
}

.woocommerce-product-details__short-description a:hover,
.woocommerce-product-details__short-description a:focus-visible,
.woocommerce-Tabs-panel--description a:hover,
.woocommerce-Tabs-panel--description a:focus-visible,
#tab-description a:hover,
#tab-description a:focus-visible,
.main-navigation .nav-menu > li > a:hover,
.main-navigation .nav-menu > li > a:focus-visible,
.main-navigation .nav-menu > li.current-menu-item > a,
.main-navigation .nav-menu > li.current-menu-ancestor > a {
    color: var(--primary-color);
}

.woocommerce-product-details__short-description a:hover::after,
.woocommerce-product-details__short-description a:focus-visible::after,
.woocommerce-Tabs-panel--description a:hover::after,
.woocommerce-Tabs-panel--description a:focus-visible::after,
#tab-description a:hover::after,
#tab-description a:focus-visible::after,
.main-navigation .nav-menu > li > a:hover::after,
.main-navigation .nav-menu > li > a:focus-visible::after,
.main-navigation .nav-menu > li.current-menu-item > a::after,
.main-navigation .nav-menu > li.current-menu-ancestor > a::after {
    transform: scaleX(1);
}

@media (max-width: 768px) {
    .main-navigation .nav-menu > li > a::after {
        content: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .woocommerce-product-details__short-description a,
    .woocommerce-Tabs-panel--description a,
    #tab-description a,
    .main-navigation .nav-menu > li > a {
        transition: color 0.15s ease;
    }

    .woocommerce-product-details__short-description a::after,
    .woocommerce-Tabs-panel--description a::after,
    #tab-description a::after,
    .main-navigation .nav-menu > li > a::after {
        transition: none;
    }
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
}

button {
    cursor: pointer;
    border: none;
    background: none;
}

ul,
ol {
    list-style: none;
}

/* Light page transitions — leave fade only (no blank enter flash) */
@media (prefers-reduced-motion: no-preference) {
    body.qt-transitions {
        transition: opacity 0.1s ease;
    }

    body.qt-transitions.qt-page-leave {
        opacity: 0;
    }
}

/* ============================================
   Header Styles
   ============================================ */
.site-header {
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    /* Fixed — immune to overflow-x:hidden on html/body which silently breaks position:sticky */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

/* Shadow once scrolled (all pages) */
.site-header.header-scrolled {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Hide-on-scroll (sticky header JS toggles .header-hidden) */
.site-header.header-hidden {
    transform: translateY(-100%);
}

/* Top-bar slides up and fades out on first scroll, leaving only header-main visible.
   All four properties share one duration/easing so nothing finishes early and pops. */
.site-header .header-top-bar {
    max-height: 48px;
    opacity: 1;
    overflow: hidden;
    transform: translateY(0);
    transition: max-height 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                padding 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.site-header.header-scrolled .header-top-bar {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    transform: translateY(-8px);
    pointer-events: none;
}

/* Product pages: announcement bar is not rendered; keep CSS fallback if markup is present */
/* overflow-x:hidden breaks position:sticky; clip keeps PDP gallery sticky usable */
html:has(body.single-product-page),
body.single-product-page {
    overflow-x: clip;
}

/* Same reason for the shop/category archives: overflow-x:hidden on html/body
   silently kills position:sticky on .shop-sidebar. Keyed off the layout itself
   so every archive using it (shop, product_cat, collections) is covered. */
html:has(.shop-layout),
body:has(.shop-layout) {
    overflow-x: clip;
}

/* Offset body so fixed header doesn't overlap content.
   --header-height is the expanded header (set once per real resize by JS); when the top bar
   collapses the offset shrinks to the main row here, on the same curve as the bar itself, so
   header and content move as one instead of the content chasing a JS-measured height. */
body {
    padding-top: var(--header-height, 0px);
    transition: padding-top 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

body:has(.site-header.header-scrolled) {
    padding-top: var(--header-main-height, var(--header-height, 0px));
}

@media (prefers-reduced-motion: reduce) {
    body,
    .site-header .header-top-bar,
    body.single-product-page .header-top-bar {
        transition: none;
    }
}

.header-top-bar {
    background: var(--header-top-bg);
    padding: 9px 8px; /* ~35% shorter than previous 14px vertical padding */
    font-size: 12px;
    font-weight: 500;
    color: var(--header-top-text);
}

.header-top-bar--carousel {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
}

.header-top-bar__viewport {
    flex: 1;
    min-width: 0;
    max-width: 40%;
}

.header-top-bar__track {
    display: grid;
    margin: 0;
    padding: 0;
}

.header-top-bar__item {
    grid-area: 1 / 1;
    margin: 0;
    padding: 0;
    line-height: 1.1rem;
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    /* Fade/slide out over the full duration, then flip visibility (0s delayed to the end)
       so the outgoing line never pops away mid-fade. */
    transition: opacity 0.5s ease, transform 0.5s ease, visibility 0s linear 0.5s;
    will-change: opacity, transform;
    pointer-events: none;
}

.header-top-bar__item.is-active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity 0.5s ease, transform 0.5s ease, visibility 0s linear 0s;
    pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
    .header-top-bar__item {
        transition: none;
        transform: none;
    }

    .header-top-bar__item.is-active {
        transition: none;
        transform: none;
    }
}

.header-top-bar__btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px;
    margin: 0;
    border: none;
    background: transparent;
    /* Match announcement text (Customizer --header-top-text); Hugeicons use currentColor after theme processing */
    color: var(--header-top-text);
    cursor: pointer;
    line-height: 0;
}

.header-top-bar__btn svg {
    display: block;
    flex-shrink: 0;
}

.header-top-bar__btn svg :where(path, line, circle, ellipse, polyline) {
    stroke: currentColor;
}

/* RTL: flip top-bar chevrons direction (visual only). */
[dir="rtl"] .header-top-bar__btn svg {
    transform: scaleX(-1);
}

.header-top-bar__btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.header-top-bar--single .header-top-bar__btn {
    display: none;
}

.header-top-bar--single .header-top-bar__viewport {
    flex: 1 1 auto;
}

@media (max-width: 768px) {
    .header-top-bar {
        padding: 10px 10px; /* −4px total height vs desktop 9px vertical */
    }

    .header-top-bar__viewport {
        max-width: 100%;
    }
    .header-top-bar__item {
        font-size: 12px;
        font-weight: 500 !important;
    }
}

.header-main {
    /* Full-bleed header: spans the viewport, content held off the edges by side padding */
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 15px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: padding 0.35s cubic-bezier(0.4, 0, 0.2, 1), min-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    gap: 30px;
    min-height: 75px;
    /* Don't clip fixed positioned children */
    overflow: visible;
}

.site-logo {
    flex-shrink: 0;
}

.site-logo img {
    max-height: 50px;
    width: auto;
}

.main-navigation {
    flex: 1;
    display: flex;
    justify-content: center;
}

.main-navigation ul {
    display: flex;
    gap: 25px;
    align-items: center;
}

.main-navigation a {
    font-size: 15px;
    color: #333;
    letter-spacing: 0px;
}

.header-search {
    flex-shrink: 0;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    color: #333;
}

.header-search:hover {
    color: var(--primary-color);
}

.header-search svg {
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
    fill: none;
    overflow: visible;
    transition: color 0.2s;
}

.header-search svg path {
    fill: none;
    stroke: currentColor;
}

/* Header account (My Account / auth) */
.header-account {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #333;
    line-height: 0;
    text-decoration: none;
}

.header-account:hover {
    color: var(--primary-color);
}

.header-account svg {
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
    fill: none;
    overflow: visible;
    transition: color 0.2s;
}

.header-account svg path {
    fill: none;
    stroke: currentColor;
}

/* Desktop wishlist (before account) */
.header-wishlist {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #333;
    line-height: 0;
    text-decoration: none;
}

.header-wishlist:hover {
    color: var(--primary-color);
}

.header-wishlist svg {
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
    fill: none;
    overflow: visible;
    transition: color 0.2s;
}

.header-wishlist svg path {
    fill: none;
    stroke: currentColor;
}

/* Mobile: account sits beside menu; desktop: before search */
.header-leading {
    display: none;
}

.header-account--mobile {
    display: none;
}

/* Header Actions Container */
.header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* The search bar is the flexible element in the header row, so the nav sizes
   to its own content instead of competing with it for free space. */
@media (min-width: 769px) {
    .header-actions {
        flex: 1 1 auto;
        justify-content: flex-end;
        gap: 16px;
        min-width: 0;
    }

    .main-navigation {
        flex: 0 1 auto;
    }
}

/* ---- Desktop inline search bar + live results ---- */
.header-search-bar {
    position: relative;
    /* Grows into the free space between logo/nav and the action icons */
    flex: 1 1 400px;
    max-width: 440px;
    min-width: 0;
}

/* Live region for screen readers only */
.header-search-bar__status.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Desktop shows the bar, mobile falls back to the icon + popup */
.header-search {
    display: none;
}

.header-search-bar__form {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 12px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.9);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.header-search-bar__form:focus-within {
    border-color: var(--primary-color);
    background: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 16%, transparent);
}

.header-search-bar__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #666;
    line-height: 0;
}

.header-search-bar__icon svg {
    width: 20px;
    height: 20px;
    fill: none;
}

.header-search-bar__icon svg path {
    fill: none;
    stroke: currentColor;
}

.header-search-bar__input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: none;
    font-family: inherit;
    font-size: 14px;
    color: #333;
    padding: 0;
    text-align: start;
}

.header-search-bar__input::placeholder {
    color: #999;
}

/* `dir="auto"` follows typed Arabic/Latin text, but browsers default an empty
   search input to LTR instead of using its Arabic placeholder. */
[dir="rtl"] .header-search-bar__input:placeholder-shown,
[dir="rtl"] .search-popup-input:placeholder-shown {
    direction: rtl;
}

/* Hide the browser's native search clear affordance — we ship our own */
.header-search-bar__input::-webkit-search-decoration,
.header-search-bar__input::-webkit-search-cancel-button,
.header-search-bar__input::-webkit-search-results-button,
.header-search-bar__input::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
}

.header-search-bar__clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.06);
    color: #555;
    cursor: pointer;
    line-height: 0;
    transition: background 0.2s ease, color 0.2s ease;
}

.header-search-bar__clear:hover {
    background: rgba(0, 0, 0, 0.12);
    color: #111;
}

.header-search-bar__clear svg {
    width: 12px;
    height: 12px;
}

.header-search-bar__spinner {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(0, 0, 0, 0.12);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: qt-live-search-spin 0.7s linear infinite;
}

@keyframes qt-live-search-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .header-search-bar__spinner {
        animation-duration: 1.6s;
    }
}

.header-search-results {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 1100;
    max-height: min(70vh, 460px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.14);
    padding: 6px;
}

.header-search-results__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-search-results__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 10px;
    text-decoration: none;
    color: #333;
    line-height: 1.35;
    transition: background 0.15s ease;
}

.header-search-results__item:hover,
.header-search-results__item.is-active,
.header-search-results__item:focus-visible {
    background: rgba(0, 0, 0, 0.05);
    outline: none;
}

.header-search-results__thumb {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: 8px;
    background: #f2f2f2;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.header-search-results__meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    flex: 1;
}

.header-search-results__title {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    color: #222;
    /* Single line + ellipsis keeps every row the same height */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: start;
    unicode-bidi: plaintext;
}

.header-search-results__price {
    font-size: 13px;
    line-height: 1.35;
    color: #666;
    text-align: start;
    unicode-bidi: isolate;
}

/* WooCommerce price HTML carries global rules (26px, bold, display:flex) that
   would blow up these compact rows — neutralise them inside the dropdown only. */
.header-search-results__price .woocommerce-Price-amount,
.header-search-results__price .amount {
    display: inline;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    text-align: inherit;
    text-transform: none;
    color: var(--primary-color);
}

.header-search-results__price bdi {
    display: inline;
    white-space: nowrap;
}

.header-search-results__price .woocommerce-Price-currencySymbol {
    font-size: 0.92em;
    font-weight: 500;
}

.header-search-results__price ins {
    text-decoration: none;
    font-weight: 600;
    background: none;
    color: var(--primary-color);
}

.header-search-results__price del,
.header-search-results__price del .woocommerce-Price-amount {
    font-weight: 400;
    color: #9a9a9a;
}

.header-search-results__price del {
    opacity: 0.75;
    margin-inline-end: 6px;
}

/* Variable-product ranges ("4.400 – 10.500") stay on one line */
.header-search-results__price .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.header-search-results__empty {
    margin: 0;
    padding: 18px 12px;
    text-align: center;
    font-size: 14px;
    color: #777;
}

.header-search-results__more {
    display: block;
    margin-top: 4px;
    padding: 11px 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.07);
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--primary-color);
    text-decoration: none;
    border-radius: 0 0 10px 10px;
    transition: background 0.15s ease;
}

.header-search-results__more:hover {
    background: rgba(0, 0, 0, 0.04);
}

/* Tablet/small desktop: narrow the bar before it starts squeezing the nav */
@media (max-width: 1100px) and (min-width: 769px) {
    .header-search-bar {
        flex-basis: 260px;
        max-width: 320px;
    }

    .header-main {
        gap: 18px;
        /* Step the full-bleed side padding down before the mobile block takes over */
        padding-left: 24px;
        padding-right: 24px;
    }
}

/* Header Cart Icon */
.header-cart {
    flex-shrink: 0;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    position: relative;
    color: #333;
}

.header-cart:hover {
    color: var(--primary-color);
}

.header-cart svg {
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
    fill: none;
    overflow: visible;
    transition: color 0.2s;
}

.header-cart svg path {
    fill: none;
    stroke: currentColor;
}

.cart-count {
    position: absolute;
    top: -8px;
    right: -8px;
    background: var(--primary-color);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    border-radius: var(--theme-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
}

.cart-count:empty {
    display: none;
}

/* WooCommerce Notice Boxes */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    padding: 16px 20px;
    margin-bottom: 20px;
    border-radius: var(--theme-radius-sm);
    border-left: 4px solid;
    background: #f8f8f8;
    display: flex;
    align-items: center;
    gap: 12px;
    border-top-color: #EBF0F4!important;
    margin-top: 12px!important;
}

.woocommerce-message {
    border-left-color: #28a745;
    color: #155724;
}

/* Info notices (incl. checkout coupon prompt): theme accent, not WC teal; light fill = 10% primary via --theme-color-surface */
.woocommerce-info {
    border-left-color: var(--primary-color);
    color: #334155;
    background: var(--theme-color-surface, rgba(23, 162, 184, 0.1));
}

body.woocommerce-checkout .woocommerce-info {
    border-left-color: var(--qt-checkout-accent, var(--primary-color));
    background: var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(23, 162, 184, 0.1)));
}

/* Checkout coupon prompt — compact/minimal */
body.woocommerce-checkout .woocommerce-form-coupon-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 0;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    margin: 8px 0 12px !important;
    padding: 16px 12px;
    min-height: 0;
    gap: 8px;
    border-width: 0;
    border-radius: 0;
    font-size: 14px;
    line-height: 1.3;
    color: #4b5563;
    background: rgba(250, 250, 250, 0);
    justify-content: center;
    align-items: center;
    width: fit-content;
    max-width: 458px;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
    display: none;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a,
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
    font-size: inherit;
    font-weight: 500;
    text-underline-offset: 2px;
}

.woocommerce-error {
    border-left-color: #ff4444;
    color: #721c24;
    background: #f8d7da;
}

/* Checkout: hide the big error summary — fields already show validation state */
body.woocommerce-checkout .woocommerce-NoticeGroup-checkout,
body.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup,
body.woocommerce-checkout form.checkout > .woocommerce-error {
    display: none !important;
}

/* Shell checkout: coupon errors are inline under the field — hide default WC banners */
body.qt-checkout-shell .woocommerce-notices-wrapper .woocommerce-error,
body.qt-checkout-shell .woocommerce-notices-wrapper .wc-block-components-notice-banner.is-error,
body.qt-checkout-shell > .woocommerce-error,
body.qt-checkout-shell .woocommerce > .woocommerce-error,
body.qt-checkout-shell .qt-checkout-form--shell > .woocommerce-error {
    display: none !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.woocommerce-message a,
.woocommerce-error a {
    color: inherit;
    text-decoration: underline;
    font-weight: 700;
}

.woocommerce-info a,
.woocommerce-info a.showcoupon {
    color: var(--primary-color);
    text-decoration: underline;
    font-weight: 700;
}

.woocommerce-message a:hover,
.woocommerce-error a:hover {
    text-decoration: none;
}

.woocommerce-info a:hover,
.woocommerce-info a.showcoupon:hover {
    color: var(--primary-color-hover, var(--primary-color));
    filter: brightness(0.92);
    text-decoration: none;
}

body.woocommerce-checkout .woocommerce-info a,
body.woocommerce-checkout .woocommerce-info a.showcoupon {
    color: var(--qt-checkout-accent, var(--primary-color));
}

body.woocommerce-checkout .woocommerce-info a:hover,
body.woocommerce-checkout .woocommerce-info a.showcoupon:hover {
    color: var(--qt-checkout-accent, var(--primary-color));
    filter: brightness(0.92);
}

.woocommerce-Price-amount {
    color: var(--primary-color);
}

/* Shared canvas panel header (cart, mobile menu, shop filters) */
.canvas-panel-header,
.side-cart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: max(16px, calc(10px + env(safe-area-inset-top, 0px))) 20px 12px;
    border-bottom: 1px solid #e5e5e5;
    flex-shrink: 0;
}

.canvas-panel-header .canvas-panel-title,
.side-cart-header .canvas-panel-title,
.canvas-panel-header h3,
.side-cart-header h3 {
    font-family: var(--font-headings);
    font-size: 20px;
    font-weight: var(--font-weight-headings, 700);
    line-height: 1.3;
    margin: 0;
    color: #333;
    display: block;
}

.canvas-panel-close,
.side-cart-close {
    background: #E8E8E8;
    border: none;
    padding: 12px;
    cursor: pointer;
    color: #666;
    transition: color 0.2s;
    border-radius: var(--theme-radius);
    line-height: 0;
}

.canvas-panel-close:hover,
.side-cart-close:hover {
    color: #333;
}

.canvas-panel-close svg,
.side-cart-close svg {
    width: 20px;
    height: 20px;
    display: block;
    fill: currentColor;
}

/* Side Cart */
.side-cart {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    /* No shell fade — panel slides fully like the mobile menu */
    pointer-events: none;
}

.side-cart.active {
    pointer-events: all;
}

.side-cart-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
}

.side-cart.active .side-cart-overlay {
    opacity: 1;
}

.side-cart-panel {
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    /* Desktop: previous 400px + 30% */
    width: 520px;
    max-width: 90%;
    height: 100%;
    background: #fff;
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    border-radius: 0 var(--theme-radius) var(--theme-radius) 0;
    overflow: hidden;
    /* Match menu: enter from the left (LTR) */
    transform: translateX(-100%);
    transition: transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
    will-change: transform;
}

.side-cart.active .side-cart-panel {
    transform: translateX(0);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

[dir="rtl"] .side-cart-panel {
    left: auto;
    right: 0;
    transform: translateX(100%);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    border-radius: var(--theme-radius) 0 0 var(--theme-radius);
}

[dir="rtl"] .side-cart.active .side-cart-panel {
    transform: translateX(0);
}

/* Desktop: cart on the right, slide in right → left (LTR exception; RTL already right) */
@media (min-width: 769px) {
    .side-cart-panel {
        left: auto;
        right: 0;
        transform: translateX(100%);
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
        border-radius: var(--theme-radius) 0 0 var(--theme-radius);
    }

    .side-cart.active .side-cart-panel {
        transform: translateX(0);
    }
}

@media (max-width: 768px) {
    .side-cart-panel,
    .side-cart.active .side-cart-panel,
    [dir="rtl"] .side-cart-panel,
    [dir="rtl"] .side-cart.active .side-cart-panel {
        width: 100%;
        max-width: 100%;
        border-radius: 0;
    }
}

.side-cart-content {
    flex: 1;
    overflow-y: auto;
    padding: 0;
    height: inherit;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.side-cart-content .widget_shopping_cart_content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.side-cart-content .woocommerce-mini-cart {
    padding: 0;
    margin: 0;
}

body.cart-open {
    overflow: hidden;
}

/* ============================================
   Search Popup
   ============================================ */
.search-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
    pointer-events: none;
}

.search-popup.active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.search-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(2px);
}

.search-popup-content {
    position: relative;
    background: #fff;
    border-radius: var(--theme-radius);
    padding: 0;
    max-width: 600px;
    width: 50%;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
}

.search-popup-body {
    padding: 24px 30px 32px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.search-popup-close {
    line-height: 0;
}

.search-popup-form {
    display: flex;
    gap: 14px;
    align-items: flex-end;
    flex-wrap: nowrap;
}

.search-popup-field {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    border-bottom: 1px solid rgba(17, 17, 17, 0.2);
    padding-bottom: 10px;
}

.search-popup-field__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #6b7280;
    line-height: 0;
}

.search-popup-field__icon svg {
    width: 24px;
    height: 24px;
    display: block;
}

.search-popup-field__icon svg :where(path, line, circle, ellipse, polyline, polygon, rect) {
    stroke: currentColor;
    fill: none;
}

.search-popup-input {
    flex: 1;
    min-width: 0;
    padding: 6px 0;
    border: none;
    border-radius: 0;
    background: transparent;
    font-size: 16px;
    font-family: inherit;
    outline: none;
    transition: color 0.2s;
    box-shadow: none;
    text-align: start;
}

.search-popup-input::placeholder {
    color: #b0b0b0;
}

.search-popup-input:focus {
    outline: none;
}

.search-popup-submit {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: var(--theme-radius-sm);
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, filter 0.2s;
    font-family: inherit;
    flex-shrink: 0;
}

.search-popup-submit:hover {
    background: var(--primary-color-hover);
}

.search-popup-submit svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.search-popup-suggestions {
    margin-top: 40px;
    padding-top: 8px;
}

.search-popup-suggestions__heading {
    margin: 0 0 22px;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #9ca3af;
}

.search-popup-suggestions__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.search-popup-suggestions__item {
    margin: 0 0 20px;
}

.search-popup-suggestions__item:last-child {
    margin-bottom: 0;
}

.search-popup-suggestions__link {
    display: inline-block;
    font-size: 17px;
    font-weight: 400;
    color: #111827;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s;
}

.search-popup-suggestions__link:hover,
.search-popup-suggestions__link:focus-visible {
    color: var(--primary-color);
}

body.search-open {
    overflow: hidden;
}

/* Search panel: full-height drawer on mobile (bottom bar search) */
@media (max-width: 768px) {
    .search-popup {
        display: block;
        /* Match menu/cart: no shell fade — full slide visible start→end */
        opacity: 1;
        visibility: visible;
        transition: none;
        pointer-events: none;
    }

    .search-popup.active {
        pointer-events: all;
    }

    .search-popup-overlay {
        opacity: 0;
        transition: opacity 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
    }

    .search-popup.active .search-popup-overlay {
        opacity: 1;
    }

    .search-popup-content {
        position: fixed;
        top: 0;
        left: 0;
        right: auto;
        bottom: 0;
        width: 100%;
        max-width: 100%;
        height: 100%;
        max-height: none;
        margin: 0;
        padding: 0;
        border-radius: 0;
        box-shadow: 12px 0 48px rgba(0, 0, 0, 0.14);
        /* Match menu: enter from the left (LTR) */
        transform: translateX(-100%);
        transition: transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
        overflow: hidden;
        will-change: transform;
    }

    [dir="rtl"] .search-popup-content {
        left: auto;
        right: 0;
        transform: translateX(100%);
        box-shadow: -12px 0 48px rgba(0, 0, 0, 0.14);
        border-radius: 0;
    }

    [dir="rtl"] .search-popup.active .search-popup-content {
        transform: translateX(0);
    }

    body.quicktheme-mobile-bottom-nav .search-popup-body {
        padding-bottom: calc(28px + var(--quicktheme-mobile-bar-height, 56px) + env(safe-area-inset-bottom, 0px));
    }

    .search-popup.active .search-popup-content {
        transform: translateX(0);
    }

    .search-popup-body {
        flex: 1;
        min-height: 0;
        padding: 20px 24px 28px;
    }

    .search-popup-form {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .search-popup-submit {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        clip-path: inset(50%);
        white-space: nowrap;
        border: 0;
    }

    .search-popup-submit:focus {
        position: static;
        width: auto;
        height: auto;
        clip: auto;
        clip-path: none;
        margin-top: 12px;
        padding: 12px 24px;
    }

    .search-popup-suggestions {
        margin-top: 36px;
    }
}

/* Mobile Menu Toggle Button */
.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    padding: 8px 0;
    cursor: pointer;
    color: #333;
    align-items: center;
    gap: 4px;
}

.mobile-menu-toggle__label {
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
}

.mobile-menu-toggle--icon-only {
    gap: 0;
}

.mobile-menu-toggle__icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-menu-toggle svg {
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
    fill: none;
    overflow: visible;
}

.mobile-menu-toggle svg path {
    fill: none;
    stroke: currentColor;
}

.mobile-menu-close {
    display: none;
}

.mobile-menu-body {
    display: contents;
}

/* ============================================
   Footer Styles
   ============================================ */
.site-footer {
    margin-top: 40px;
    background: #f2f2f2;
    /* Same ink as headings/body text so the footer reads as part of the page. */
    color: #333;
}

/* Simple centred stack: logo → menu → social icons */
.footer-stack {
    padding: 64px!important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 26px;
    text-align: center;
}

.footer-logo img {
    max-height: 44px;
    width: auto;
}

.footer-nav-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 28px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.footer-menu a {
    color: var(--footer-link, #333);
    font-size: 15px;
    text-decoration: none;
    transition: opacity 0.2s;
}

.footer-menu a:hover {
    opacity: 0.75;
}

.footer-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.footer-social__link {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color);
    color: #fff;
    border-radius: var(--theme-radius);
    text-decoration: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.footer-social__link:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    color: #fff;
}

.footer-social__link svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    display: block;
    fill: none;
    stroke: #fff;
    color: #fff;
}

.footer-bottom {
    padding: 18px 20px;
    font-size: 14px;
}

.footer-bottom__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px 24px;
    flex-wrap: wrap;
    line-height: 1.5;
}

.footer-bottom__credit a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.footer-bottom__credit a:hover {
    opacity: 0.75;
}

/* ============================================
   Homepage Hero
   ============================================ */
.hero-section {
    /* +25% height on desktop */
    min-height: 562px;
    height: 62.5vh;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    text-align: start;
    padding: 60px 48px;
    background: #111;
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.1) 100%);
    z-index: 1;
}

.hero-inner {
    position: relative;
    z-index: 2;
    max-width: 800px;
    width: 100%;
    color: #fff;
    margin-bottom: 20px;
    /* Bottom-start alignment: content hugs the lower-left of the hero */
    text-align: start;
}

.hero-inner h1 {
    font-size: 26px;
    font-weight: var(--font-weight-headings);
    margin-bottom: 14px;
    color: #fff;
    line-height: 1.15;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.hero-btn-wrap {
    margin-top: 12px;
}

/* Smaller, tighter CTA to match the reduced title */
.hero-btn-wrap .shop-button {
    padding: 11px 26px;
    font-size: 14px;
}

/* Mobile keeps the centred layout and a shorter hero — the bottom-start
   treatment above is a desktop composition. */
@media (max-width: 768px) {
    .hero-section {
        /* Unchanged from the original — the +25% is desktop-only. */
        min-height: 450px;
        height: 50vh;
        justify-content: center;
        text-align: center;
        padding: 60px 20px;
    }

    .hero-inner {
        text-align: center;
    }

    .hero-inner h1 {
        font-size: 24px;
    }
}

.shop-button {
    display: inline-block;
    padding: 15px 45px;
    background: var(--primary-color);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border-radius: var(--theme-radius);
    /* Rounded pill style like screenshot */
    transition: all 0.3s ease;
    cursor: pointer;
    text-transform: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.shop-button:hover {
    background: var(--primary-color-hover);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}

/* ============================================
   Homepage Marquee Band
   Full-bleed scrolling strip under the hero.
   Duration comes from the Customizer via --marquee-duration (inline).
   ============================================ */
.marquee-band {
    --marquee-duration: 30s;
    --marquee-bg: var(--primary-color);
    --marquee-text: #fff;
    width: 100%;
    background: var(--marquee-bg);
    color: var(--marquee-text);
    overflow: hidden;
    padding: 14px 0;
    user-select: none;
}

.marquee-band__viewport {
    display: flex;
    width: max-content;
    direction: ltr;
}

.marquee-band__track {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    direction: ltr;
    margin: 0;
    padding: 0;
    list-style: none;
    animation: qt-marquee-scroll var(--marquee-duration) linear infinite;
    will-change: transform;
}

/* Right-scrolling starts a full track to the left and travels back to 0. */
.marquee-band__track--right {
    animation-name: qt-marquee-scroll-reverse;
}

.marquee-band:hover .marquee-band__track {
    animation-play-state: paused;
}

.marquee-band__item {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

.marquee-band__text {
    display: inline-block;
    flex: 0 0 auto;
    font-family: var(--font-headings), var(--font-body), "Noto Sans Arabic", "Tahoma", "Arial", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
    white-space: nowrap;
    text-align: start;
    unicode-bidi: isolate;
}

.marquee-band__text--rtl {
    direction: rtl;
}

.marquee-band__sep {
    width: 6px;
    height: 6px;
    margin: 0 28px;
    border-radius: 50%;
    background: #D5A657;
    opacity: 1;
    flex: 0 0 auto;
}

@keyframes qt-marquee-scroll {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-100%, 0, 0); }
}

@keyframes qt-marquee-scroll-reverse {
    from { transform: translate3d(-100%, 0, 0); }
    to   { transform: translate3d(0, 0, 0); }
}

@media (max-width: 768px) {
    .marquee-band {
        padding: 15px 0;
    }

    .marquee-band__text {
        font-size: 14px;
    }

    .marquee-band__sep {
        margin: 0 18px;
    }
}

/* Static, readable fallback when motion is reduced. */
@media (prefers-reduced-motion: reduce) {
    .marquee-band__track {
        animation: none;
    }

    .marquee-band__viewport {
        width: 100%;
        justify-content: center;
    }

    .marquee-band__track:nth-child(2) {
        display: none;
    }

    .marquee-band__track {
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 6px;
        padding: 0 20px;
    }
}

/* ============================================
   Categories Grid Section
   ============================================ */
.categories-grid-section {
    padding: 60px 20px;
    background: #fff;
}

.categories-grid-title {
    text-align: start;
    font-size: 24px;
    font-weight: var(--font-weight-headings);
    color: #333;
    margin-bottom: 40px;
}

.categories-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-grid-item {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s;
}

.category-grid-item:hover {
    transform: translateY(-4px);
}

.category-grid-image {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #f8f8f8;
    border-radius: var(--theme-radius);
    overflow: hidden;
    margin-bottom: 0;
}

.category-grid-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.category-grid-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    text-align: start;
    margin: 10px 0 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    flex-wrap: wrap;
    min-height: 0;
}

.category-grid-name__count,
.category-name__count {
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    white-space: nowrap;
}

@media (max-width: 768px) {
    .categories-grid-section {
        padding: 40px 20px;
    }

    .categories-grid-title {
        font-size: 20px;
        margin-bottom: 30px;
    }

    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .category-grid-name {
        font-size: 14px;
    }
}

/* ============================================
   Subcategories Slider — category archive pages
   ============================================ */
.subcat-slider-section {
    padding: 28px 0 24px;
    background: #fff;
}

.subcat-slider-header {
    margin-bottom: 16px;
}

.subcat-slider-title {
    font-size: 20px;
    font-weight: var(--font-weight-headings);
    color: #333;
}

.subcat-slider-wrapper {
    position: relative;
    padding: 0 48px;
}

.subcat-slider-viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.subcat-slider-viewport::-webkit-scrollbar {
    display: none;
}

.subcat-slider-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 3 * 20px) / 4);
    gap: 20px;
    padding-bottom: 2px;
}

.subcat-slide {
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease;
}

.subcat-slide:hover {
    transform: translateY(-3px);
}

.subcat-slide-image {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #f8f8f8;
    border-radius: var(--theme-radius);
    overflow: hidden;
}

.subcat-slide-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.subcat-slide-name {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    text-align: center;
    margin: 10px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
    min-height: 36px;
}

.subcat-slide-name__count {
    font-size: 12px;
    font-weight: 600;
    color: var(--primary-color);
    white-space: nowrap;
}

.subcat-slider-btn {
    display: none;
    position: absolute;
    top: calc(50% - 18px);
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 50%;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.15s ease, opacity 0.15s ease;
    padding: 0;
    color: #333;
    z-index: 2;
}

.subcat-slider-btn:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.13);
}

.subcat-slider-btn:disabled {
    opacity: 0.3;
    cursor: default;
    pointer-events: none;
}

.subcat-slider-btn--prev {
    left: 0;
}

.subcat-slider-btn--next {
    right: 0;
}

.subcat-slider-has-overflow .subcat-slider-btn {
    display: flex;
}

@media (max-width: 1024px) {
    .subcat-slider-track {
        grid-auto-columns: calc((100% - 2 * 20px) / 3);
    }
}

@media (max-width: 640px) {
    .subcat-slider-section {
        padding: 20px 0 16px;
    }

    .subcat-slider-wrapper {
        padding: 0 40px;
    }

    .subcat-slider-track {
        grid-auto-columns: calc((100% - 20px) / 2);
        gap: 16px;
    }

    .subcat-slider-btn {
        width: 32px;
        height: 32px;
    }

    .subcat-slider-btn--prev { left: 0; }
    .subcat-slider-btn--next { right: 0; }
}

/* ============================================
   Latest Products Section
   ============================================ */
.latest-products-section {
    padding: 20px 20px;
    background: #fff;
}

.latest-products-header,
.related-products-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.related-products-header {
    padding-bottom: 0;
    margin-bottom: 16px;
}

.latest-products-header {
    margin-bottom: 32px;
    padding-bottom: 0;
}

.latest-products-title,
.related-products-title {
    text-align: start;
    font-weight: var(--font-weight-headings);
    color: #333;
    margin: 0;
    flex: 1;
    min-width: 0;
}

.latest-products-title {
    font-size: 24px;
}

.related-products-title {
    font-size: 28px;
}

.view-more-link {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    text-decoration: underline;
    transition: color 0.2s;
}

.view-more-link:hover {
    color: var(--primary-color-hover);
}

/* Specific grids moved lower to override base styles */

/* More Products Button */
.more-products-button-wrapper {
    text-align: center;
    margin-top: 40px;
}

.more-products-button {
    display: inline-block;
    padding: 15px 40px;
    background: var(--primary-color);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    border-radius: var(--theme-radius);
    transition: background 0.2s, filter 0.2s;
    cursor: pointer;
}

.more-products-button:hover {
    background: var(--primary-color-hover);
}

/* ============================================
   Related Products Section (header matches .latest-products-header)
   ============================================ */
.related-products-section {
    background: #fff;
    padding: 32px 0 20px;
}

/* Related products moved lower */

/* ============================================
   Single Product Page
   ============================================ */
.single-product-wrapper {
    max-width: 1388px;
    margin: 20px auto;
    padding: 0 20px;
}

/* Product Sticky Bottom Button — mobile only */
.product-sticky-bottom {
    display: none;
}

@media (max-width: 768px) {
    .product-sticky-bottom {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 999;
        padding: 12px 20px;
        background: #fff;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
        transform: translateY(100%);
        transition: transform 0.3s ease;
    }

    .product-sticky-bottom.visible {
        transform: translateY(0);
    }
}

.sticky-bottom-cta {
    display: block;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    padding: 14px 20px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: var(--theme-radius);
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
    text-align: center;
}

.sticky-bottom-cta:hover {
    background: var(--primary-color-hover);
}

/* PDP swatch-driven accent: bg/text vars are set per-visitor by pdp-swatch-theme.js
   from the picked QuickForm colour swatch; fallbacks keep the default look until then.
   Text-on-accent flips dark on light swatches so it stays readable; smooth recolour. */
body.single-product-page .header-top-bar {
    color: var(--primary-on, var(--header-top-text));
    /* This selector outranks `.site-header .header-top-bar`, so a bare shorthand here
       REPLACES the collapse transition and the bar snaps shut on PDP. Restate the
       collapse properties alongside the PDP accent-recolour ones. */
    transition: max-height 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                padding 0.28s cubic-bezier(0.4, 0, 0.2, 1),
                background-color 0.35s ease,
                color 0.35s ease;
}
body.single-product-page .qf-submit {
    color: var(--primary-on, #fff) !important;
    transition: background-color 0.35s ease, color 0.35s ease;
}

/* Variable products: mute add-to-cart + quantity until a full variation is picked.
   Toggled by pdp-variant-gate.js; mirrors QuickForm's own upsell lock look. */
.qf-form .qf-add-to-cart.qf-variant-locked,
.qf-form .qf-qty.qf-variant-locked {
    opacity: 0.45;
    pointer-events: none;
    cursor: not-allowed;
    transition: opacity 0.25s ease;
}

.product-images {
    position: sticky;
    top: calc(var(--header-main-height, var(--header-height, 70px)) + 16px);
    width: 100%;
    min-width: 0;
    align-self: start;
    z-index: 1;
}

.gallery-slide {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.55s ease-in-out, visibility 0.7s ease-in-out;
    z-index: 0;
    pointer-events: none;
}

.gallery-slide.active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
    pointer-events: auto;
}

.gallery-slide img,
.gallery-slide .product-gallery-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: var(--theme-radius-sm);
}

.gallery-thumbnails {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.gallery-thumbnails__rail {
    display: contents;
}

.gallery-thumbs-nav {
    display: none;
}

.gallery-thumb {
    width: 80px;
    height: 80px;
    flex: 0 0 80px;
    aspect-ratio: 1 / 1;
    /* Fixed 1:1 square */
    box-sizing: border-box;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.2s, border-color 0.2s;
    border: 2px solid transparent;
    border-radius: var(--theme-radius);
    overflow: hidden;
    position: relative;
    padding: 0;
    margin: 0;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
}

.gallery-thumb:hover,
.gallery-thumb.active {
    opacity: 1;
    border-color: var(--primary-color);
}

.gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    pointer-events: none;
}

.product-summary {
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    min-width: 0;
}

.product-title {
    font-size: 32px;
    font-weight: 700;
    margin: 0;
}

/* Title + reviews: above gallery on mobile, above summary on desktop */
.product-intro {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    min-width: 0;
}

.product-intro__meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    width: 100%;
    min-width: 0;
}

.product-intro__meta-row .qt-stock,
.product-intro__meta-row .woocommerce-product-rating {
    margin: 0;
}

/* Single product summary: filled stars + review count (optically centered) */
.woocommerce-product-rating {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px 10px;
    line-height: 1;
}

.woocommerce-product-rating .product-card-stars {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    height: 16px;
    /* Optical: filled star glyph reads slightly high vs. text */
    transform: translateY(1px);
}

.woocommerce-product-rating .woocommerce-rating-average {
    color: #000;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
}

.woocommerce-product-rating .woocommerce-review-link {
    font-size: 13px;
    font-weight: 400;
    color: #888;
    text-decoration: none;
    cursor: pointer;
    line-height: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.woocommerce-product-rating .woocommerce-review-link:hover {
    color: var(--primary-color);
}

.woocommerce-product-rating .product-card-star {
    width: 16px;
    height: 16px;
    line-height: 0;
}

.woocommerce-product-rating .product-card-star svg {
    width: 16px;
    height: 16px;
    display: block;
}

.woocommerce-product-rating .product-card-star-fg svg {
    width: 16px;
    height: 16px;
    display: block;
}

/* Product Star Rating */
.product-star-rating {
    display: flex;
    gap: 4px;
    margin: -12px 0px;
    line-height: 1;
}

.product-star-rating .star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s;
}

.product-star-rating .star svg {
    width: 20px;
    height: 20px;
    display: block;
    fill: #edbf40;
}

.product-star-rating .star.filled {
    color: #FFD700;
    /* Gold color for filled stars */
}

.product-star-rating .star.empty {
    color: #ddd;
    /* Light gray for empty stars */
}

/* Gallery Lightbox — mobile full-screen preview */
html.gallery-lightbox-open,
body.gallery-lightbox-open {
    overflow: hidden !important;
    overscroll-behavior: none;
}

body.gallery-lightbox-open {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}

.gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    overscroll-behavior: none;
}

.lightbox-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.92);
    cursor: zoom-out;
    touch-action: none;
}

.lightbox-stage {
    position: relative;
    z-index: 10001;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.lightbox-track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.28s ease;
    will-change: transform;
}

.lightbox-slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 56px 16px 24px;
    box-sizing: border-box;
}

.lightbox-image,
.lightbox-content img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
}

.lightbox-content {
    position: relative;
    z-index: 10001;
    max-width: 90%;
    max-height: 90%;
}

.lightbox-close {
    position: fixed;
    top: max(12px, env(safe-area-inset-top, 0px));
    inset-inline-end: 12px;
    z-index: 10002;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.lightbox-close:hover,
.lightbox-close:focus-visible {
    background: rgba(255, 255, 255, 0.28);
    outline: none;
}

@media (min-width: 769px) {
    /* Desktop uses hover zoom — hide lightbox chrome if ever opened. */
    .gallery-lightbox {
        display: none !important;
    }
}

.product-price {
    font-size: 32px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 30px;
    font-variant-numeric: normal;
}

/* Consolidated Product Tabs moved to end of file */

.product-description p {
    margin-bottom: 16px;
}

.product-description p:last-child {
    margin-bottom: 0;
}

.product-description h1,
.product-description h2,
.product-description h3,
.product-description h4 {
    margin-top: 24px;
    margin-bottom: 16px;
    color: #333;
}

.product-description ul,
.product-description ol {
    margin: 16px 0;
    padding-right: 20px;
}

.product-description li {
    margin-bottom: 8px;
}

/* ============================================
   Responsive Design
   ============================================ */
@media (max-width: 768px) {
    .header-main {
        justify-content: center;
        position: relative;
        padding: 14px 20px; /* +4px height vs prior 12px vertical */
        min-height: 64px;
    }

    .mobile-menu-toggle svg,
    .header-account svg,
    .header-wishlist svg,
    .header-search svg,
    .header-cart svg {
        width: 28px;
        height: 28px;
    }

    /* Sticky header mobile adjustments */
    body:not(.single-product-page):not(.landing-page) .site-header.header-scrolled .header-main {
        min-height: 56px;
        padding: 8px 20px; /* +4px height vs prior 6px vertical */
    }

    .site-logo {
        text-align: center;
    }

    /* Physical left/right (not inset-inline-*) so menu stays left & cart stays right in RTL too */
    .header-leading {
        display: flex;
        align-items: center;
        gap: 8px;
        direction: ltr;
        position: absolute;
        left: 20px;
        right: auto;
        order: 1;
        z-index: 1;
    }

    .mobile-menu-toggle {
        display: flex;
        position: static;
        left: auto;
        right: auto;
    }

    .header-account--mobile {
        display: inline-flex;
    }

    .header-account--desktop {
        display: none !important;
    }

    .header-wishlist {
        display: none !important;
    }

    .header-actions {
        position: absolute;
        right: 20px;
        left: auto;
        order: 3;
        display: flex !important;
        flex-direction: row !important;
        align-items: center;
        gap: 12px;
        direction: ltr;
    }

    /* Mobile keeps the icon + full-screen search popup */
    .header-search-bar {
        display: none;
    }

    .header-search {
        display: block;
        position: static;
        order: 1;
    }

    .header-cart {
        order: 2;
    }

    .site-header--hide-mobile-search .header-search,
    .site-header--hide-mobile-profile .header-account--mobile,
    .site-header--hide-mobile-cart .header-cart {
        display: none !important;
    }

    .mobile-menu-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(2px);
        z-index: 99998;
        opacity: 0;
        visibility: hidden;
        transition: opacity 480ms cubic-bezier(0.4, 0.05, 0.35, 1), visibility 480ms;
        pointer-events: none;
    }

    body.menu-open .mobile-menu-overlay {
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }

    /*
     * backdrop-filter on .site-header creates a containing block for position:fixed
     * descendants, so the drawer was sized to the header instead of the viewport
     * (looked like a z-index bug — page content showed under/through the menu).
     * Keep it off while closing too — body.menu-open is removed at close start,
     * but the slide-out still needs a viewport-level fixed containing block.
     */
    body.menu-open .site-header,
    body.menu-closing .site-header {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        z-index: 100000;
    }

    /* Move menu to viewport level when on mobile to break out of header containing block */
    .main-navigation {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        margin: 0 !important;
        background: #fff;
        z-index: 99999 !important;
        display: flex !important;
        flex-direction: column;
        justify-content: flex-start;
        padding: 0;
        transform: translateX(-100%);
        /* Delay visibility:hidden until slide-out finishes (open had no delay, close was snapping) */
        transition: transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1), visibility 0s linear 480ms;
        overflow: hidden;
        contain: none !important;
        isolation: isolate;
        visibility: hidden;
        pointer-events: none;
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.12);
        border-radius: 0;
    }

    .main-navigation.menu-open {
        transform: translateX(0) !important;
        visibility: visible !important;
        pointer-events: auto;
        /* Show immediately on open so the slide-in is visible */
        transition: transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1), visibility 0s linear 0s;
    }

    [dir="rtl"] .main-navigation {
        left: auto !important;
        right: 0 !important;
        transform: translateX(100%);
        box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
        border-radius: 0;
    }

    [dir="rtl"] .main-navigation.menu-open {
        transform: translateX(0) !important;
    }

    .mobile-menu-header {
        display: flex;
    }

    .mobile-menu-body {
        display: block;
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 0 20px 20px;
    }

    /* Menu body entrance: fade/slide links in after the drawer finishes opening */
    .main-navigation .mobile-menu-body .nav-menu > li {
        opacity: 0;
        transform: translateY(10px);
        transition: none;
    }

    .main-navigation.menu-open .mobile-menu-body .nav-menu > li {
        opacity: 1;
        transform: translateY(0);
        transition: opacity 480ms cubic-bezier(0.4, 0.05, 0.35, 1), transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
    }

    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(1) { transition-delay: 480ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(2) { transition-delay: 540ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(3) { transition-delay: 600ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(4) { transition-delay: 660ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(5) { transition-delay: 720ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(6) { transition-delay: 780ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(7) { transition-delay: 840ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(8) { transition-delay: 900ms; }
    .main-navigation.menu-open .mobile-menu-body .nav-menu > li:nth-child(n+9) { transition-delay: 960ms; }

    /* Match shared canvas close button (same as cart / search) */
    .mobile-menu-close {
        display: inline-flex;
    }

    .main-navigation ul {
        flex-direction: column;
        gap: 0;
        width: 100%;
    }

    .main-navigation li {
        width: 100%;
        border-bottom: 1px solid #e5e5e5;
    }

    .main-navigation a {
        display: block;
        padding: 15px 0;
        font-size: 16px;
    }

    /* Slide-out menu: keep nav tracking consistent */
    .main-navigation a {
        letter-spacing: 0;
    }

    .hero-content h1 {
        font-size: 32px;
    }

    .latest-products-title {
        font-size: 20px;
    }

    .related-products-title {
        font-size: 1.0625rem; /* 17px: compact row next to "Plus" */
    }

    .latest-products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px 20px;
    }

    .related-products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px 20px;
    }

    .product-content {
        flex-direction: column;
    }

    .product-images {
        position: static;
        width: 100%;
        flex: 0 0 100%;
    }

    .product-summary {
        width: 100%;
        flex: 0 0 100%;
    }

    .product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 0.875rem;
    }

    .woocommerce-Tabs-panel {
        padding: 18px 14px 22px;
    }

    .product-description {
        font-size: 14px;
    }
}

/* ============================================
   Landing Page Template
   ============================================ */
.landing-page-wrapper {
    width: 100%;
}

.landing-page-wrapper .entry-content {
    width: 100%;
}

/* Elementor compatibility - full width */
.elementor-page .landing-page-wrapper {
    padding: 0;
}

/* ============================================
   Utility Classes
   ============================================ */
.container {
    max-width: 1388px;
    margin: 0 auto;
    padding: 20px;
    width: 100%;
}

@media (min-width: 1388px) {
    .container {
        width: 1388px;
    }
}
@media (max-width: 768px) {
    .container {
        padding: 20px 20px;
    }
}

/* ============================================
   Page / post Gutenberg prose
   (global * reset removes default margins)
   ============================================ */
body.page .container > article .entry-header,
body.single-post .container > article .entry-header {
    margin: 0 0 32px;
    text-align: center;
}

body.page .container > article .entry-title,
body.single-post .container > article .entry-title {
    margin: 0;
    font-size: 2.25rem;
    line-height: 1.2;
    font-weight: var(--font-weight-headings);
    color: #111;
}

body.page .container > article .entry-content,
body.single-post .container > article .entry-content {
    max-width: 760px;
    margin: 0 auto 48px;
    font-size: 1.05rem;
    line-height: 1.75;
    color: #333;
}

body.page .container > article .entry-content > *:first-child,
body.single-post .container > article .entry-content > *:first-child {
    margin-top: 0;
}

body.page .container > article .entry-content > *:last-child,
body.single-post .container > article .entry-content > *:last-child {
    margin-bottom: 0;
}

body.page .container > article .entry-content p,
body.single-post .container > article .entry-content p,
body.page .container > article .entry-content .wp-block-paragraph,
body.single-post .container > article .entry-content .wp-block-paragraph {
    margin: 0 0 1.25em;
}

body.page .container > article .entry-content :is(h1, h2, h3, h4, h5, h6),
body.single-post .container > article .entry-content :is(h1, h2, h3, h4, h5, h6) {
    color: #111;
    font-weight: var(--font-weight-headings);
    line-height: 1.25;
    margin: 2em 0 0.65em;
}

body.page .container > article .entry-content :is(h1, h2, h3, h4, h5, h6):first-child,
body.single-post .container > article .entry-content :is(h1, h2, h3, h4, h5, h6):first-child {
    margin-top: 0;
}

body.page .container > article .entry-content h1,
body.single-post .container > article .entry-content h1 {
    font-size: 2rem;
}

body.page .container > article .entry-content h2,
body.single-post .container > article .entry-content h2 {
    font-size: 1.75rem;
}

body.page .container > article .entry-content h3,
body.single-post .container > article .entry-content h3 {
    font-size: 1.35rem;
}

body.page .container > article .entry-content h4,
body.single-post .container > article .entry-content h4 {
    font-size: 1.15rem;
}

body.page .container > article .entry-content h5,
body.single-post .container > article .entry-content h5 {
    font-size: 1.05rem;
}

body.page .container > article .entry-content h6,
body.single-post .container > article .entry-content h6 {
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

body.page .container > article .entry-content ul,
body.single-post .container > article .entry-content ul,
body.page .container > article .entry-content ol,
body.single-post .container > article .entry-content ol {
    margin: 0 0 1.15em;
    padding-left: 1.4em;
}

body.page .container > article .entry-content li,
body.single-post .container > article .entry-content li {
    margin: 0 0 0.4em;
}

body.page .container > article .entry-content li:last-child,
body.single-post .container > article .entry-content li:last-child {
    margin-bottom: 0;
}

body.page .container > article .entry-content a,
body.single-post .container > article .entry-content a {
    color: var(--primary-color);
    text-decoration: underline;
    text-underline-offset: 2px;
}

body.page .container > article .entry-content a:hover,
body.single-post .container > article .entry-content a:hover {
    opacity: 0.85;
}

body.page .container > article .entry-content blockquote,
body.single-post .container > article .entry-content blockquote {
    margin: 0 0 1.25em;
    padding: 0.75em 0 0.75em 1.15em;
    border-left: 3px solid var(--primary-color);
    color: #555;
}

body.page .container > article .entry-content hr,
body.single-post .container > article .entry-content hr {
    margin: 2em 0;
    border: 0;
    border-top: 1px solid #e5e5e5;
}

@media (max-width: 768px) {
    body.page .container > article .entry-title,
    body.single-post .container > article .entry-title {
        font-size: 1.75rem;
    }

    body.page .container > article .entry-content,
    body.single-post .container > article .entry-content {
        font-size: 1rem;
    }

    body.page .container > article .entry-content h1,
    body.single-post .container > article .entry-content h1 {
        font-size: 1.75rem;
    }

    body.page .container > article .entry-content h2,
    body.single-post .container > article .entry-content h2 {
        font-size: 1.5rem;
    }

    body.page .container > article .entry-content h3,
    body.single-post .container > article .entry-content h3 {
        font-size: 1.25rem;
    }
}

/**
 * Max 1388px content width, centered, no horizontal padding.
 * Use inside sections that already set side padding (pair with .categories-grid-section / .latest-products-section).
 */
.container--flush-x {
    max-width: 1388px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding: 0;
    box-sizing: border-box;
}

.text-center {
    text-align: center;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

/* ============================================
   Product Gallery Styles
   ============================================ */

/* ============================================
   Error 404 Styles
   ============================================ */
.error-404 {
    padding: 80px 20px;
}

.error-404 h1 {
    font-size: 120px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.error-404 h2 {
    font-size: 32px;
    margin-bottom: 15px;
}

.error-404 p {
    font-size: 18px;
    color: #666;
    margin-bottom: 30px;
}

/* ============================================
   Shop Page Styles
   ============================================ */
.shop-page-wrapper {
    max-width: 1388px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ── Shop Layout: sidebar + main ────────────────────────────────────────── */
.shop-layout {
    display: flex;
    align-items: flex-start;
    gap: 32px;
}

.shop-sidebar {
    flex: 0 0 260px;
    width: 260px;
    position: sticky;
    top: calc(var(--header-height, 70px) + 20px);
    max-height: calc(100vh - var(--header-height, 70px) - 40px);
    overflow-y: auto;
    overflow-x: hidden;
    /* Breathing room so the last widget never sits flush against the cut edge. */
    padding-bottom: 8px;
    /* A slim track, not none: with no scrollbar at all the clipped content just
       looked truncated, with nothing to say it could be scrolled. */
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.18) transparent;
    overscroll-behavior: contain;
}

.shop-sidebar::-webkit-scrollbar {
    width: 6px;
}

.shop-sidebar::-webkit-scrollbar-track {
    background: transparent;
}

.shop-sidebar::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.16);
    border-radius: 999px;
}

.shop-sidebar:hover::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.28);
}

@media (min-width: 769px) {
    .mobile-menu-header {
        display: none;
    }
}

@media (min-width: 901px) {
    .shop-sidebar__header,
    .shop-sidebar__mobile-close {
        display: none;
    }
}

.shop-main {
    flex: 1;
    min-width: 0;
}

.shop-toolbar__left {
    display: flex;
    align-items: center;
    gap: 16px;
}

.shop-sidebar__toggle {
    display: none;
    align-items: center;
    gap: 6px;
    height: var(--shop-toolbar-btn-height, 36px);
    padding: 0 14px;
    box-sizing: border-box;
    border: 1px solid #e0e0e0;
    border-radius: var(--theme-radius-sm, 6px);
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}
.shop-sidebar__toggle:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.shop-sidebar__backdrop { display: none; }

/* ── Sidebar inner ──────────────────────────────────────────────────────── */
.shop-sidebar__inner {
    display: flex;
    flex-direction: column;
}

.sf-widget {
    border-bottom: 1px solid #f0f0f0;
    padding: 20px 0;
}
.sf-widget:first-child { padding-top: 0; }
.sf-widget:last-child  { border-bottom: none; }

.sf-widget__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    margin: 0 0 16px;
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    cursor: pointer;
    text-align: start;
    letter-spacing: 0.01em;
}

.sf-chevron {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: #64748b;
    line-height: 0;
    /* Same duration/curve as the panel below, so arrow and body read as one motion. */
    transition: transform 260ms cubic-bezier(0.4, 0, 0.2, 1), color 0.2s ease;
}
.sf-chevron svg {
    display: block;
    width: 16px;
    height: 16px;
}
.sf-widget__toggle:hover .sf-chevron {
    color: #111;
}
.sf-widget__toggle[aria-expanded="false"] .sf-chevron {
    transform: rotate(-90deg);
}
[dir="rtl"] .sf-widget__toggle[aria-expanded="false"] .sf-chevron {
    transform: rotate(90deg);
}

/* Collapsible panels. The JS animates an explicit height between 0 and the measured
   content height, then clears it — so the panel keeps its natural height afterwards
   and a "load more" list growing taller doesn't get clipped by a stale max-height.
   overflow is only clipped while animating, leaving the price slider's thumb free. */
.sf-widget__body.is-animating {
    overflow: hidden;
    transition: height 260ms cubic-bezier(0.4, 0, 0.2, 1);
}

.sf-widget__body.is-collapsed {
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .sf-widget__body.is-animating {
        transition: none;
    }

    .sf-chevron {
        transition: none;
    }
}

/* ── List filters ───────────────────────────────────────────────────────── */
.sf-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.sf-list__item--hidden { display: none; }

.sf-list__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 8px;
    border-radius: var(--theme-radius-sm, 6px);
    text-decoration: none;
    color: #444;
    font-size: 13.5px;
    transition: background 0.15s, color 0.15s;
}
.sf-list__link:hover {
    background: #f5f5f5;
    color: var(--primary-color);
}
.sf-list__link.is-active {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    color: var(--primary-color);
    font-weight: 600;
}
.sf-list__count { font-size: 12px; color: #aaa; }
.sf-list__link.is-active .sf-list__count { color: var(--primary-color); }

.sf-load-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    padding: 0;
    border: none;
    background: none;
    font-size: 13px;
    color: var(--primary-color);
    cursor: pointer;
    font-weight: 500;
    transition: opacity 0.15s;
}
.sf-load-more:hover { opacity: 0.75; }

/* ── Price slider ───────────────────────────────────────────────────────── */
.sf-range-wrap {
    position: relative;
    height: 20px;
    margin-bottom: 18px;
}
.sf-range-track {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 4px;
    background: #e8e8e8;
    border-radius: 2px;
    transform: translateY(-50%);
}
.sf-range-fill {
    position: absolute;
    inset-inline-start: 0;
    height: 100%;
    background: var(--primary-color);
    border-radius: 2px;
}
.sf-range {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 4px;
    transform: translateY(-50%);
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    pointer-events: none;
    outline: none;
}
.sf-range--max { z-index: 1; }
.sf-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--primary-color);
    cursor: pointer;
    pointer-events: all;
    box-shadow: 0 1px 4px rgba(0,0,0,0.15);
    transition: box-shadow 0.15s;
}
.sf-range::-webkit-slider-thumb:hover,
.sf-range::-webkit-slider-thumb:active {
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--primary-color) 15%, transparent);
}
.sf-range::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--primary-color);
    cursor: pointer;
    pointer-events: all;
    box-shadow: 0 1px 4px rgba(0,0,0,0.15);
}
.sf-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}
.sf-price-input-group {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 1;
    border: 1px solid #e0e0e0;
    border-radius: var(--theme-radius-sm, 6px);
    padding: 5px 8px;
    transition: border-color 0.15s;
}
.sf-price-input-group:focus-within { border-color: var(--primary-color); }
.sf-price-currency { font-size: 12px; color: #888; flex-shrink: 0; }
.sf-price-input-group input[type="number"] {
    border: none;
    outline: none;
    width: 100%;
    font-size: 13px;
    color: #333;
    padding: 0;
    background: transparent;
    -moz-appearance: textfield;
    appearance: textfield;
}
.sf-price-input-group input[type="number"]::-webkit-inner-spin-button,
.sf-price-input-group input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; appearance: none; }
.sf-price-sep { color: #ccc; font-size: 14px; flex-shrink: 0; }
.sf-price-apply {
    display: block;
    width: 100%;
    padding: 9px 16px;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: var(--theme-radius-sm, 6px);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
}
.sf-price-apply:hover { opacity: 0.85; }

/* ── Rating filter ──────────────────────────────────────────────────────── */
.sf-rating-link { gap: 8px; justify-content: flex-start; }
.sf-stars { display: flex; align-items: center; gap: 1px; flex-shrink: 0; }
.sf-star { color: #e0e0e0; }
.sf-star--filled { color: #f5a623; }
.sf-rating-label { font-size: 13px; color: #666; }
.sf-rating-link.is-active .sf-rating-label { color: var(--primary-color); font-weight: 600; }

/* ── Active filter pills ────────────────────────────────────────────────── */
.sf-active-filters { padding-bottom: 20px; }
.sf-active-filters__label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #aaa;
    margin: 0 0 8px;
}
.sf-active-filters__pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.sf-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 100px;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    color: var(--primary-color);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s;
}
.sf-pill:hover { background: color-mix(in srgb, var(--primary-color) 18%, transparent); }
.sf-clear-all { font-size: 12px; color: #999; text-decoration: underline; text-underline-offset: 2px; }
.sf-clear-all:hover { color: var(--primary-color); }

/* ── Mobile drawer ──────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .shop-layout { gap: 0; }

    .shop-sidebar {
        position: fixed;
        inset-block: 0;
        inset-inline-start: 0;
        width: 100%;
        max-width: 100%;
        max-height: 100vh;
        background: #fff;
        z-index: 1100;
        box-shadow: 4px 0 24px rgba(0,0,0,0.12);
        /* Full off-canvas travel — same as mobile menu */
        transform: translateX(-100%);
        transition: transform 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
        padding: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border-radius: 0;
        will-change: transform;
    }
    .shop-sidebar.is-open { transform: translateX(0); }

    [dir="rtl"] .shop-sidebar {
        box-shadow: -4px 0 24px rgba(0,0,0,0.12);
        transform: translateX(100%);
        border-radius: 0;
    }
    [dir="rtl"] .shop-sidebar.is-open { transform: translateX(0); }

    .shop-sidebar__header {
        display: flex;
    }

    .shop-sidebar__mobile-close {
        display: inline-flex;
    }

    .shop-sidebar__inner {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 20px 20px 40px;
    }

    .shop-sidebar__toggle { display: inline-flex; }

    .shop-sidebar__backdrop {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 1090;
        opacity: 0;
        pointer-events: none;
        transition: opacity 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
    }
    .shop-sidebar__backdrop.is-visible {
        opacity: 1;
        pointer-events: all;
    }
}

/* ── Page Hero (Breadcrumb + Title) ─────────────────────────────────────────
   Shared: shop, category archives, checkout, cart
   ──────────────────────────────────────────────────────────────────────────*/
.page-hero {
    text-align: center;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
    padding: 48px 20px 36px;
    margin-bottom: 40px;
    border-bottom: 1px solid #f0f0f0;
}

.page-hero__breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    font-size: 13px;
}

.page-hero__crumb {
    color: #999;
    text-decoration: none;
    transition: color 0.2s;
    padding: 2px 4px;
}

a.page-hero__crumb:hover {
    color: var(--primary-color);
}

.page-hero__crumb--current {
    color: #444;
    font-weight: 500;
}

.page-hero__sep {
    display: flex;
    align-items: center;
    color: #ccc;
    flex-shrink: 0;
    line-height: 1;
}

.page-hero__sep svg {
    display: block;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    fill: none;
    overflow: visible;
}

.page-hero__sep svg path {
    fill: none;
    stroke: currentColor;
}

[dir="rtl"] .page-hero__sep svg {
    transform: scaleX(-1);
}

.page-hero__title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0;
    line-height: 1.2;
}

.shop-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    flex-wrap: wrap;
    gap: 15px;
    --shop-toolbar-btn-height: 36px;
}

.shop-results-count {
    font-size: 14px;
    color: #666;
}

.shop-sorting {
    flex-shrink: 0;
}

.shop-sorting__trigger {
    position: relative;
    width: var(--shop-toolbar-btn-height, 36px);
    height: var(--shop-toolbar-btn-height, 36px);
}

.shop-sorting__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border: 1px solid #e0e0e0;
    border-radius: var(--theme-radius-sm);
    background: #fff;
    color: #333;
    pointer-events: none;
}

.shop-sorting__icon svg {
    width: 18px;
    height: 18px;
    display: block;
}

.shop-sorting .woocommerce-ordering {
    margin: 0;
    position: absolute;
    inset: 0;
}

.shop-sorting select.orderby {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--theme-radius-sm);
    opacity: 0;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Shop & category archives: 4 columns alongside sidebar (matches loop_shop_columns) */
.shop-page-wrapper ul.products {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

/*
 * WooCommerce applies clearfix to ul.products (::before/::after with display:table).
 * On a grid container those pseudos become grid items and consume the first column.
 */
.shop-page-wrapper ul.products::before,
.shop-page-wrapper ul.products::after,
.woocommerce ul.products.products-grid::before,
.woocommerce ul.products.products-grid::after,
.woocommerce-page ul.products.products-grid::before,
.woocommerce-page ul.products.products-grid::after {
    content: none !important;
    display: none !important;
}

/* WooCommerce layout.css uses float + 22.05% width; grid needs full-width cells */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products-grid li.product {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

/* Sidebar eats ~300px, so step down to 3 before cards get too narrow. */
@media (max-width: 1400px) {
    .shop-page-wrapper ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .shop-page-wrapper ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .shop-page-wrapper ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}

@media (max-width: 600px) {
    .shop-page-wrapper ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}

@media (max-width: 400px) {
    .shop-page-wrapper ul.products {
        grid-template-columns: 1fr;
    }
}

/* Subcategories: own row above products (not mixed into ul.products — see functions.php) */
.product-subcategories {
    max-width: 1388px;
    margin: 0 auto 32px;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
}

.product-categories-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.product-categories-grid li.product {
    min-width: 0;
    width: 100%;
}

/* Match archive product card look for category tiles */
.product-categories-grid .product-category a {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.product-categories-grid .product-category .woocommerce-loop-category__title {
    margin: 10px 0 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
}

.product-categories-grid .woocommerce-loop-category__title mark {
    background: none;
    color: inherit;
    font-weight: 600;
}

.qt-cat-count {
    color: var(--primary-color);
    font-weight: 600;
}

.product-categories-grid img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: var(--theme-radius);
    display: block;
}

@media (max-width: 1200px) {
    .product-categories-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .product-categories-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 500px) {
    .product-categories-grid {
        grid-template-columns: 1fr;
    }
}

.search-products-grid {
    grid-template-columns: repeat(4, 1fr);
    max-width: 1388px;
    margin: 0 auto;
}

/* Specific Grid Overrides - Placed here to ensure they override .products-grid */
.latest-products-grid,
.related-products-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    max-width: 1388px;
    margin: 0 auto;
    gap: 30px;
}

.latest-products-grid li,
.related-products-grid li {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    list-style: none !important;
}

/* ============================================
   Product Card Styles (minimal: image, title, price, rating)
   ============================================ */
.product-card {
    position: relative;
    border: 1px solid var(--qt-field-border, #e5e7eb);
    border-radius: var(--theme-radius);
    /* visible (not hidden) so the wishlist heart can still slide out on unhover —
       the image rounds its own top corners instead of relying on the card to clip. */
    overflow: visible;
    background: #fff;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.product-card:hover {
    box-shadow: none;
}

.product-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

/*
 * Product card image frame: locked 4:5 portrait.
 * Must use content-box — with the global border-box reset,
 * height:0 + padding-bottom:125% would collapse to 0px.
 * Absolute images so WooCommerce’s height:auto cannot stretch the card.
 */
.product-card .product-image-wrapper,
.product-image-wrapper {
    position: relative;
    width: 100%;
    box-sizing: content-box !important;
    height: 0 !important;
    padding: 0 0 125% !important; /* 5/4 → 4:5 */
    aspect-ratio: auto !important;
    flex: 0 0 auto;
    align-self: stretch;
    background: #fff;
    /* visible so the heart can slide out on unhover; images clip on the link */
    overflow: visible;
    border-radius: var(--theme-radius) var(--theme-radius) 0 0;
}

.product-card .product-image-link,
.product-image-link {
    display: block;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0;
    overflow: hidden;
    /* -1px nests the image inside the card's border instead of overlapping it. */
    border-radius: calc(var(--theme-radius) - 1px) calc(var(--theme-radius) - 1px) 0 0;
}

.product-badge-discount {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    background: var(--primary-color);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 8px 12px;
    border-end-end-radius: var(--theme-radius);
    pointer-events: none;
    z-index: 2;
}

/*
 * Fill the 4:5 frame. WooCommerce’s
 * `.woocommerce ul.products li.product a img { height:auto; margin:0 0 1em }`
 * must not win — keep cover crop inside the fixed frame.
 */
.product-card .product-image-wrapper img,
.product-card .product-image-wrapper .product-image,
.product-image-wrapper img,
.product-image-wrapper .product-image,
.woocommerce ul.products li.product .product-image-wrapper img,
.woocommerce-page ul.products li.product .product-image-wrapper img,
ul.products-grid li.product .product-image-wrapper img,
.latest-products-grid li.product .product-image-wrapper img,
.related-products-grid li.product .product-image-wrapper img,
.woocommerce ul.products li.product a.product-image-link img,
ul.products-grid li.product a.product-image-link img {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    /* Anchor to the top: square product shots cropped into the 4:5 card would
       otherwise lose the model's head. Trimming the bottom keeps the face and
       the garment's neckline, which is what shoppers scan for. */
    object-position: top center !important;
    display: block !important;
    box-shadow: none !important;
}

/* Hover: crossfade to gallery / variation image (secondary fades in over primary) */
.product-image-wrapper.has-secondary .product-image--secondary {
    opacity: 0;
    z-index: 1;
    transition: opacity 0.4s ease-in-out !important;
    will-change: opacity;
    pointer-events: none;
}

.product-image-wrapper.has-secondary .product-image--primary {
    z-index: 0;
    opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
    .product-card:hover .product-image-wrapper.has-secondary .product-image--secondary {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .product-image-wrapper.has-secondary .product-image--secondary,
    .product-card-wishlist {
        transition: none !important;
    }
}

/* Heart: slides in from the inline-end on card hover (animates both ways) */
.product-card-wishlist {
    --qt-wl-slide: 14px;
    position: absolute;
    inset-block-start: 12px;
    inset-inline-end: 12px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: var(--theme-radius);
    background: rgba(255, 255, 255, 0.94);
    color: #1e293b;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(var(--qt-wl-slide), 0, 0);
    transition:
        transform var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
        opacity var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
        visibility 0s linear var(--qt-reveal-duration, 0.35s),
        color 0.2s ease,
        background 0.2s ease;
}

[dir="rtl"] .product-card-wishlist {
    --qt-wl-slide: -14px;
}

.product-card-wishlist svg {
    width: 18px;
    height: 18px;
    display: block;
}

.product-card-wishlist .qt-heart-fill {
    display: none;
}

.product-card-wishlist .qt-heart-outline {
    display: block;
}

.product-card-wishlist.is-active {
    color: #f43f5e;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
}

.product-card-wishlist.is-active .qt-heart-outline {
    display: none;
}

.product-card-wishlist.is-active .qt-heart-fill {
    display: block;
}

.product-card-wishlist:hover {
    background: #fff;
    color: #f43f5e;
}

.product-card-wishlist:focus-visible {
    background: #fff;
    color: #f43f5e;
    outline: 2px solid #f43f5e;
    outline-offset: 2px;
}

.product-card-wishlist:not(:focus-visible) {
    outline: none;
}

.product-card .product-card-wishlist__yith {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

@media (hover: hover) and (pointer: fine) {
    .product-card:hover .product-card-wishlist,
    .product-card-wishlist:focus-visible,
    .product-card-wishlist.is-active {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
        /* Show immediately on enter; leave uses base transition (visibility delayed) */
        transition:
            transform var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
            opacity var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
            visibility 0s linear 0s,
            color 0.2s ease,
            background 0.2s ease;
    }
}

/* Touch: always show heart (no hover). */
@media (hover: none), (pointer: coarse) {
    .product-card-wishlist {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }
}

/* Card body: everything under the image. flex:1 lets the CTA sit on the bottom edge
   (margin-top:auto), so buttons line up across a row no matter how many lines the
   title wraps to. */
.product-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 8px;
    padding: 12px;
    text-align: start;
    align-items: flex-start;
}
@media (max-width: 767px) {
    a.qt-button.product-card__cta {
        font-size: 13px !important;
    }
}

.product-link--title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: inherit;
    line-clamp: inherit;
    height: auto;
    max-height: 2.85rem; /* 2 lines of 1.425rem line-height */
    line-height: 1.35;
    overflow: hidden;
    color: inherit;
    text-decoration: none;
}

/* Stretched link: the title anchor covers the whole card, so the card stays clickable
   without wrapping the CTA in a second <a> (invalid, and a double tab stop). The heart
   sits at z-index 4 and the CTA at 2, both above this overlay. */
.product-link--title::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* Extra breathing room under the price. It lives here rather than on the CTA because
   the CTA's `margin-top: auto` (bottom-pinning) would override a fixed top margin —
   this sets the minimum gap, and auto still absorbs any leftover space above it. */
.product-card .product-price-wrapper {
    margin-block-end: 8px;
}

.product-card__cta {
    width: 100%;
    margin-top: auto;
    /* Above the stretched title link so the CTA is its own click target. */
    position: relative;
    z-index: 2;
    min-height: 40px;
    font-size: 13px;
}

/* Loop card: variation swatches (QuickFORM / Emran-compatible logic) */
.product-card-swatches {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0 0 4px;
}

.product-card-swatches-inner {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.product-card-swatch {
    width: 21px;
    height: 21px;
    padding: 4px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: var(--theme-radius);
    flex-shrink: 0;
    box-sizing: border-box;
}

.product-card-swatch--color {
    background-color: #e8e8e8;
}

.product-card-swatch--image {
    background-color: #f2f2f2;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 4px;
}

.product-card-swatch--label {
    background: rgba(240, 240, 240, 0);
    color: #333;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 500;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    overflow: hidden;
}

.product-card-swatch-label-text {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 1px;
}

.product-card .product-title {
    font-size: 15px;
    font-weight: 500;
    color: #000;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-align: start;
    line-height: 1.3;
}

.product-price-wrapper {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 8px;
    flex-wrap: wrap;
}

.product-card .product-price-original {
    font-size: 14px;
    color: #888;
    text-decoration: line-through;
    font-weight: 500;
    font-variant-numeric: normal;
}

.product-card .product-price-original .woocommerce-Price-amount bdi {
    color: rgba(0, 0, 0, 0.4);
}

.product-card .product-price-current {
    font-size: 15px;
    font-weight: 700;
    color: #000;
    font-variant-numeric: normal;
    line-height: 1.2;
    text-decoration: none;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    max-width: 100%;
}

.product-card .product-price-current .woocommerce-Price-amount {
    color: #000;
    font-variant-numeric: normal;
    text-decoration: none;
}

.product-card .product-price-current .woocommerce-Price-amount bdi {
    font-weight: 600;
}

/* Loop card meta row: category at the inline-start, rating at the inline-end.
   min-height holds the row even when a product has no category or no reviews, so
   titles and CTAs stay on the same baseline across a grid. */
.product-card__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 16px;
    line-height: 1;
    margin-top: 4px;
}

.product-card__category {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    min-height: 1.3rem;
    line-height: 1.3rem;
}

.product-card-rating {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: auto;
    font-size: 12px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1;
}

.product-card-rating__star {
    display: inline-flex;
    color: #f5a623;
    line-height: 0;
}

.product-card-rating__star svg {
    display: block;
    width: 14px;
    height: 14px;
}

.product-card-stars {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.product-card-star {
    position: relative;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.product-card-star svg {
    width: 14px;
    height: 14px;
    display: block;
    overflow: visible;
}

/* Hugeicons StarIcon (solid-rounded); colors via path fill */
.product-card-star--full path {
    fill: #eab308;
    stroke: none;
}

.product-card-star--empty path {
    fill: #e0e0e0;
    stroke: none;
}

.product-card-star--split {
    position: relative;
    width: 14px;
    height: 14px;
}

.product-card-star-bg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card-star-bg path {
    fill: #e0e0e0;
    stroke: none;
}

.product-card-star-fg {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.product-card-star-fg svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.product-card-star-fg path {
    fill: #eab308;
    stroke: none;
}

.product-card-rating-value {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}

.product-card-rating-count,
.product-card-swatches-more {
    font-size: 13px;
    font-weight: 400;
    color: #888;
}

.no-products {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

/* ============================================
   Pagination Styles
   ============================================ */
.pagination,
.navigation {
    margin: 40px 0;
    text-align: center;
}

.page-numbers {
    display: inline-flex;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
    justify-content: center;
}

.page-numbers li {
    display: inline-block;
}

.page-numbers a,
.page-numbers span {
    display: inline-block;
    padding: 8px 12px;
    min-width: 40px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: var(--theme-radius-sm);
    color: #333;
    text-decoration: none;
    transition: all 0.2s;
    cursor: pointer;
}

.page-numbers a:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.page-numbers .current {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
    font-weight: 700;
}

.page-numbers .dots {
    border: none;
    padding: 8px 4px;
}

.page-numbers .prev,
.page-numbers .next {
    font-weight: 700;
}

/* ============================================
   Shop Page Responsive
   ============================================ */
@media (max-width: 768px) {
    .page-hero {
        padding: 32px 16px 24px;
        margin-bottom: 24px;
    }

    .page-hero__title {
        font-size: 1.75rem;
    }

    .shop-toolbar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .shop-page-wrapper ul.products,
    ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    /* Search grid becomes 2 columns on tablet */
    .search-products-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Latest and related products become 2 columns on tablet */
    .latest-products-grid,
    .related-products-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px 20px;
    }
}

@media (max-width: 480px) {
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    /* Search grid becomes 1 column on mobile */
    .search-products-grid {
        grid-template-columns: 1fr;
    }

    /* Grids become 2 columns on mobile */
    .latest-products-grid,
    .related-products-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px 10px;
    }

    .latest-products-title {
        font-size: 20px;
    }

    .related-products-title {
        font-size: 18px;
    }

    /* Unified override above handles this */

    .product-card .product-card__body {
        padding: 10px;
        gap: 8px;
    }

    .product-card-swatch {
        width: 21px;
        height: 21px;
    }

    /* Product card typography adjustments for mobile */
    .product-card__category {
        font-size: 11px;
        line-height: 1.15;
    }

    .product-card .product-title {
        font-size: 14px;
        line-height: 1.3rem;
    }

    .product-card .product-price-wrapper {
        gap: 4px 6px;
        margin-block-end: 6px;
        line-height: 1.1;
    }

    .product-card .product-price-current {
        font-size: 14px;
        line-height: 1.1;
    }

    .product-card .product-price-original {
        font-size: 13px;
        line-height: 1.1;
    }

    .page-numbers a,
    .page-numbers span {
        padding: 6px 10px;
        min-width: 36px;
        font-size: 14px;
    }
}

.woocommerce-Price-amount {
    font-size: 26px;
    font-weight: 700;
    font-variant-numeric: normal;
    line-height: 1.2;
    display: flex;
    text-align: center;
    text-transform: uppercase;
}

/* Single product page price styling - only regular price has line-through */
.product-summary p.price,
.product-summary .price,
.product-intro p.price,
.product-intro .price {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
    color: var(--primary-color);
}

.product-summary .price del,
.product-intro .price del {
    text-decoration: line-through !important;
    color: #333;
    opacity: 0.5;
}

.product-summary .price del .woocommerce-Price-amount,
.product-intro .price del .woocommerce-Price-amount {
    color: inherit;
}

.product-summary .price ins,
.product-intro .price ins {
    text-decoration: none !important;
    /* Remove default underline from ins tag */
    color: var(--primary-color);
    font-size: 40px;
    font-weight: 700;
    display: inline-block;
}

.product-summary .price ins .woocommerce-Price-amount,
.product-intro .price ins .woocommerce-Price-amount {
    text-decoration: none !important;
    color: var(--primary-color);
}

.woocommerce-product-details__short-description {
    color: #666;
    line-height: 1.6;
}

/* Discount Badge */
.product-discount-badge {
    display: inline-flex;
    align-items: center;
    background: #28a745;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 8px;
    border-radius: var(--theme-radius-sm);
    margin-inline-start: 8px;
    line-height: 1.2;
    vertical-align: middle;
}

.product-discount-badge__text {
    white-space: nowrap;
}

/* Product Header Wrapper */
.product-header-wrapper {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    flex-wrap: nowrap;

}

/* Product Custom Tagline */
.product-custom-tagline {
    display: inline-block;
    background-color: #FFDF86;
    /* Gold Background */
    color: #8B4400;
    font-size: 13px;
    font-weight: 500;
    padding: 6px 8px;
    border-radius: var(--theme-radius-sm);
    margin-bottom: 0;
    line-height: normal;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
}

.product-custom-tagline:before {
    animation: shiny 2s ease-in-out infinite;
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 30px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.8);
    pointer-events: none;
    z-index: 1;
}

.product_title.entry-title {
    line-height: 1.3em;
    margin-bottom: 4px;
    font-size: 1.75rem;

    /* Margin handled by flex gap */
}

/* ============================================
   QuickFORM Compatibility Fixes
   ============================================ */

/* Tiny checkmark on colour swatches — always present so unselect can fade out */
.qf-swatch.qf-swatch-color::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 5px;
	height: 9px;
	margin: 0;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	background: none;
	transform: translate(-50%, -58%) rotate(45deg) scale(0.6);
	opacity: 0;
	box-sizing: border-box;
	pointer-events: none;
	filter: drop-shadow(0 0 1.5px rgba(0, 0, 0, 0.55));
	transition: opacity 0.22s ease, transform 0.22s ease;
}

.qf-swatch.qf-swatch-color.selected::before {
	opacity: 1;
	transform: translate(-50%, -58%) rotate(45deg) scale(1);
}

.qf-swatch.qf-swatch-color {
	position: relative;
}

.qf-swatch.qf-swatch-color,
.qf-swatch.qf-swatch-image {
	transition: border-color 0.22s ease, box-shadow 0.22s ease, outline-offset 0.22s ease, outline-color 0.22s ease, opacity 0.22s ease;
}

/* Ensure proper flexbox layout isn't disrupted by QuickFORM styles */
.single-product-wrapper .product-content {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    align-items: start !important;
    clear: none !important;
    float: none !important;
}

.product-details {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    width: 100%;
}

/* Desktop: gallery | details (intro + summary stacked, no tall empty grid row) */
@media (min-width: 769px) {
    .single-product-wrapper .product-content {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
        gap: 40px !important;
    }

    .single-product-wrapper .product-images {
        flex: 0 0 calc(60% - 20px);
        width: calc(60% - 20px) !important;
        max-width: calc(60% - 20px);
    }

    .single-product-wrapper .product-details {
        flex: 0 0 calc(40% - 20px);
        width: calc(40% - 20px);
        max-width: calc(40% - 20px);
    }

    .single-product-wrapper .product-summary {
        width: 100% !important;
    }
}

/* Product Breadcrumb */
.product-breadcrumb {
    width: 100%;
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #666;
    padding: 0;
}

.product-breadcrumb a {
    color: #666;
    text-decoration: none;
    transition: color 0.2s ease;
}

.product-breadcrumb a:hover {
    color: var(--primary-color, #17a2b8);
}

.breadcrumb-separator {
    color: #999;
    margin: 0;
}

.breadcrumb-current {
    color: #333;
    font-weight: 500;
}

.single-product-wrapper .product-images,
.single-product-wrapper .product-summary {
    clear: none !important;
    float: none !important;
    box-sizing: border-box !important;
}

@media (min-width: 769px) {
    .single-product-wrapper .product-images {
        /* Sticky + positioned containing block: gallery sets height, thumb rail fills it */
        position: sticky !important;
        top: calc(var(--header-main-height, var(--header-height, 70px)) + 16px);
        align-self: start;
        display: block;
    }

    .single-product-wrapper .product-images:has(.gallery-thumbnails) {
        padding-inline-start: 120px; /* wider 4:5 thumb rail + gutter */
    }

    /* Vertical thumbnail rail — wider portrait thumbs (FIGS-style 4:5) */
    .single-product-wrapper .gallery-thumbnails {
        position: absolute;
        inset-block: 0;
        inset-inline-start: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 4px;
        margin: 0;
        width: 108px;
        height: 100%;
        max-height: 100%;
        overflow: visible;
        box-sizing: border-box;
        padding-inline: 2px;
    }

    .single-product-wrapper .gallery-thumbnails__rail {
        display: flex;
        flex-direction: column;
        gap: 8px;
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: visible;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
        -ms-overflow-style: none;
        width: 100%;
        padding-block: 1px; /* keep active border from clipping at rail edges */
        box-sizing: border-box;
    }

    .single-product-wrapper .gallery-thumbnails__rail::-webkit-scrollbar {
        display: none;
    }

    .single-product-wrapper .gallery-thumbs-nav {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 28px;
        height: 28px;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent;
        color: #666;
        cursor: pointer;
        line-height: 0;
        border-radius: var(--theme-radius);
        transition: color 0.2s, opacity 0.2s;
    }

    .single-product-wrapper .gallery-thumbs-nav:hover:not(:disabled) {
        color: #111;
    }

    .single-product-wrapper .gallery-thumbs-nav:disabled,
    .single-product-wrapper .gallery-thumbs-nav[hidden] {
        opacity: 0.25;
        cursor: default;
        pointer-events: none;
    }

    .single-product-wrapper .gallery-thumbs-nav svg {
        display: block;
    }

    .single-product-wrapper .gallery-thumbs-nav--prev svg {
        transform: rotate(180deg);
    }

    .single-product-wrapper .gallery-thumb {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 5;
        flex: 0 0 auto;
        opacity: 1;
        border-width: 1px;
        border-color: transparent;
        border-radius: var(--theme-radius-sm);
    }

    .single-product-wrapper .gallery-thumb:hover {
        border-color: #ccc;
    }

    .single-product-wrapper .gallery-thumb.active {
        border-color: #111;
        opacity: 1;
    }

    .single-product-wrapper .product-gallery {
        position: relative;
        width: 100% !important;
    }
}

/* Ensure product gallery maintains proper aspect ratio */
.single-product-wrapper .product-gallery {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
    overflow: hidden !important;
    border-radius: var(--theme-radius-lg);
    background: rgba(248, 248, 248, 0);
}

.single-product-wrapper .product-gallery__track {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Counter: mobile-only pill (blurred glass); JS updates current index */
.product-gallery__counter {
    display: none;
}

.product-gallery__counter-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    color: #1e293b;
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.55);
}

/* Pagination dots — overlay seam between main image & thumbnails (no layout height) */
.product-gallery__dots {
    display: none;
}

.product-gallery__dots-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.65);
}

.product-gallery__dot {
    width: 7px;
    height: 7px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: var(--primary-color);
    opacity: 0.35;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
    appearance: none;
    -webkit-appearance: none;
}

.product-gallery__dot.is-active {
    opacity: 1;
    transform: scale(1.15);
}

.product-gallery__dot:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* Support for browsers without aspect-ratio (4/5 → 125% height) */
@supports not (aspect-ratio: 4 / 5) {
    .single-product-wrapper .product-gallery {
        height: 0 !important;
        padding-bottom: 125% !important;
    }
}

.single-product-wrapper .gallery-slide {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.7s ease-in-out, visibility 0.7s ease-in-out;
    z-index: 0;
    pointer-events: none;
}

.single-product-wrapper .gallery-slide.active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
    pointer-events: auto;
}

.single-product-wrapper .gallery-slide img,
.single-product-wrapper .gallery-slide .product-gallery-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    border-radius: var(--theme-radius-sm) !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    /* removed transition for better zoom responsiveness */
    transition: transform 0.1s ease-out;
}

.gallery-zoom-trigger {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 44px;
    height: 44px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 10;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Mobile-only prev/next on main gallery image */
.gallery-nav {
    display: none;
}

.gallery-zoom-trigger:hover {
    transform: scale(1.1);
    background: #f8f8f8;
}

.gallery-zoom-trigger svg {
    width: 20px;
    height: 20px;
}

/* Gallery back control — top logical start (LTR: top-left) */
.qt-gallery-back {
    position: absolute;
    inset-block-start: 12px;
    inset-inline-start: 12px;
    z-index: 14;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 40px;
    padding-block: 0;
    padding-inline: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #1e293b;
    box-shadow: none;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: opacity 0.15s ease, color 0.15s ease;
}

.qt-gallery-back:hover {
    transform: none;
    background: transparent;
    color: #1e293b;
    opacity: 0.75;
    text-decoration: none;
}

.qt-gallery-back:focus-visible {
    outline: 2px solid var(--primary-color, #FF583C);
    outline-offset: 2px;
}

.qt-gallery-back__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    line-height: 0;
}

.qt-gallery-back__icon svg {
    display: block;
    width: 18px;
    height: 18px;
}

[dir="rtl"] .qt-gallery-back__icon svg {
    transform: scaleX(-1);
}

.qt-gallery-back__label {
    white-space: nowrap;
}

/* PDP inline actions row: wishlist + share, below the QuickFORM order summary.
   (Replaces the heart that used to float over the gallery.) */
.qt-product-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 16px 0 0;
}

.qt-wishlist {
    display: inline-flex;
}

.qt-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px;
    margin: 0;
    border: 1px solid var(--qt-field-border, #e5e7eb);
    border-radius: var(--theme-radius, 8px);
    background: transparent;
    color: var(--qt-text, #1e293b);
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.qt-action-btn:hover {
    background: var(--theme-color-surface, rgba(0, 0, 0, 0.04));
    border-color: color-mix(in srgb, var(--primary-color, #005f5a) 35%, transparent);
}

.qt-action-btn:focus-visible {
    outline: 2px solid var(--primary-color, #005f5a);
    outline-offset: 2px;
}

.qt-action-btn__icon {
    display: inline-flex;
    flex-shrink: 0;
    line-height: 0;
}

.qt-action-btn__icon svg {
    display: block;
    width: 18px;
    height: 18px;
}

/* Saved state: the rose comes from .qt-wishlist-btn.is-active; match the edge to it. */
.qt-wishlist-btn.qt-action-btn.is-active {
    border-color: color-mix(in srgb, #f43f5e 40%, transparent);
}

/* Copy confirmation reuses the accent rather than a second colour language. */
.qt-share-btn.is-copied {
    color: var(--primary-color, #005f5a);
    border-color: color-mix(in srgb, var(--primary-color, #005f5a) 45%, transparent);
}

/* Icon-only chip — product cards. The PDP variant opts out via .qt-action-btn. */
.qt-wishlist-btn:not(.qt-action-btn) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: var(--theme-radius);
    background: rgba(255, 255, 255, 0.92);
    color: #1e293b;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    line-height: 0;
    appearance: none;
    -webkit-appearance: none;
}

/* Card chip only — must not override .product-card-wishlist leave transitions (opacity/transform). */
.qt-wishlist-btn:not(.product-card-wishlist):not(.qt-action-btn) {
    transition: transform 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.qt-wishlist-btn:not(.product-card-wishlist):not(.qt-action-btn):hover {
    transform: scale(1.06);
    background: #fff;
}

.qt-wishlist-btn:focus-visible {
    outline: 2px solid var(--primary-color, #FF583C);
    outline-offset: 2px;
}

.qt-wishlist-btn:not(.qt-action-btn) svg {
    display: block;
    width: 24px;
    height: 24px;
}

.qt-wishlist-btn .qt-heart-fill {
    display: none;
}

.qt-wishlist-btn .qt-heart-outline {
    display: block;
}

.qt-wishlist-btn.is-active {
    color: #f43f5e; /* rose */
}

.qt-wishlist-btn.is-active .qt-heart-outline {
    display: none;
}

.qt-wishlist-btn.is-active .qt-heart-fill {
    display: block;
}

.product-card-wishlist.qt-wishlist-btn {
    width: 36px;
    height: 36px;
    border: none;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);
}

.product-card-wishlist.qt-wishlist-btn svg {
    width: 18px;
    height: 18px;
}

.product-card-wishlist.qt-wishlist-btn:focus:not(:focus-visible) {
    outline: none;
}

.product-card-wishlist.qt-wishlist-btn:focus-visible {
    outline-color: #f43f5e;
}

.qt-wishlist__yith {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

/* Hide YITH’s auto-injected PDP heart — gallery QT heart is the only visible control. */
body.single-product .yith-add-to-wishlist-button-block,
body.single-product .yith-wcwl-add-to-wishlist {
    display: none !important;
}

body.single-product .qt-wishlist .yith-add-to-wishlist-button-block,
body.single-product .qt-wishlist .yith-wcwl-add-to-wishlist {
    display: block !important; /* still clipped by .qt-wishlist__yith */
}

/* Hide YITH’s own feedback/labels — QT toast replaces them. */
.yith-add-to-wishlist-button-block .yith-wcwl-add-to-wishlist-button__label,
body.single-product .yith-wcwl-message,
body.single-product .woocommerce-message.yith-wcwl-notice {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
}

.yith-wcwl-feedback-messages-container {
    display: none !important;
}

/* Favorites toast — top overlay after add */
.qt-wishlist-toast {
    position: fixed;
    top: calc(var(--header-main-height, var(--header-height, 70px)) + 12px);
    left: 50%;
    z-index: 10050;
    display: flex;
    align-items: center;
    gap: 12px;
    width: min(360px, calc(100vw - 32px));
    padding: 12px 12px 12px 12px;
    box-sizing: border-box;
    background: #fff;
    border-radius: var(--theme-radius);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.14);
    transform: translate(-50%, -8px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.qt-wishlist-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
    pointer-events: auto;
}

.qt-wishlist-toast__thumb {
    flex: 0 0 56px;
    width: 56px;
    height: 70px;
    object-fit: cover;
    border-radius: var(--theme-radius);
    background: #f1f5f9;
}

.qt-wishlist-toast__body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: start;
}

.qt-wishlist-toast__title {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: #1e293b;
}

.qt-wishlist-toast__link {
    font-size: 13px;
    line-height: 1.3;
    color: #334155;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.qt-wishlist-toast__link:hover {
    color: #0f172a;
}

.qt-wishlist-toast__close {
    flex: 0 0 auto;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin: -4px -4px 0 0;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    line-height: 0;
}

.qt-wishlist-toast__close:hover {
    background: #f1f5f9;
    color: #0f172a;
}

/* CSS Hover Scale Removed - Handled by JS for "real zoom" feel */

/* Mobile responsiveness */
@media (max-width: 768px) {
    .single-product-wrapper .product-breadcrumb-wrapper {
        margin-bottom: 16px;
    }

    .product-summary-breadcrumb,
    .page-hero__breadcrumb {
        font-size: 12px; /* −1px vs desktop */
    }

    /* Narrow screens: let the trail scroll sideways rather than squeezing the
       crumbs into each other. The row still shows the full path, and the
       scrollbar itself stays hidden. */
    .product-summary-breadcrumb {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .product-summary-breadcrumb::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
    }

    /* With a scrolling row the last crumb no longer needs to be the only
       flexible item — show it in full instead of ellipsising it. */
    .product-summary-breadcrumb .breadcrumb-current {
        flex: 0 0 auto;
        overflow: visible;
        text-overflow: clip;
    }

    .product-summary-breadcrumb .breadcrumb-item--current {
        flex: 0 0 auto;
    }

    /* page-hero trail wraps onto a second line instead of colliding. */
    .page-hero__breadcrumb {
        row-gap: 4px;
    }

    .page-hero__crumb {
        flex-shrink: 0;
    }

    .product-breadcrumb {
        font-size: 13px; /* −1px vs desktop */
    }

    /* Remove QuickFORM title dotted divider on mobile */
    .single-product-wrapper .qf-title,
    .single-product-page .qf-title {
        border-top: none;
        padding-top: 0;
    }

    /* Mobile stack: breadcrumb → gallery → title/reviews/price → form/rest.
       The visual order now matches source order, so no `order` is needed to lift the
       intro above the gallery — the H1 stays where a crawler and a screen reader meet
       it in the DOM, right before the price and the form it belongs to. */
    .single-product-wrapper .product-content {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 16px !important;
        row-gap: 16px !important;
    }

    /* Unwrap details so intro and summary are siblings of the gallery and share the
       column's 16px rhythm, rather than being one item with its own inner spacing. */
    .single-product-wrapper .product-details {
        display: contents;
    }

    .single-product-wrapper .product-intro {
        order: 2;
        width: 100%;
        gap: 8px;
        margin: 0;
        padding-bottom: 0;
    }

    .single-product-wrapper .product-intro .product-title,
    .single-product-wrapper .product-intro .product_title.entry-title {
        font-size: 22px !important;
        line-height: 1.3;
        font-weight: 600;
    }

    .single-product-wrapper .product-intro .price {
        margin: 0;
    }

    .single-product-wrapper .product-intro .price ins {
        font-size: 18px;
    }

    .single-product-wrapper .product-intro .price .woocommerce-Price-amount,
    .single-product-wrapper .product-intro .price ins .woocommerce-Price-amount {
        font-size: 18px !important;
    }

    .single-product-wrapper .product-images {
        order: 1;
        width: 100% !important;
        flex: 0 0 auto !important;
        position: static !important;
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-inline-start: 0 !important;
    }

    /* Main gallery sits inside the wrapper's 20px side padding, flush with the
       thumbnail rail and the form below it, instead of bleeding to the screen edge.
       Radius comes from the base .product-gallery rule (--theme-radius-lg) — a card
       inset from the edge needs its corners back. */
    .single-product-wrapper .product-gallery {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0;
    }

    /* ≤8 images: dots; >8: 1/N counter — both bottom-center on the main image */
    .single-product-wrapper .product-gallery[data-pager="dots"] .product-gallery__dots {
        display: flex;
        position: absolute;
        left: 50%;
        bottom: 12px;
        z-index: 8;
        margin: 0;
        padding: 0;
        transform: translateX(-50%);
        pointer-events: none;
    }

    .single-product-wrapper .product-gallery__dots-inner {
        pointer-events: auto;
    }

    .single-product-wrapper .product-gallery[data-pager="counter"] .product-gallery__counter {
        display: block;
        position: absolute;
        left: 50%;
        bottom: 12px;
        z-index: 8;
        transform: translateX(-50%);
        pointer-events: none;
    }

    .single-product-wrapper .product-summary {
        order: 3;
        width: 100% !important;
        flex: 0 0 auto !important;
    }

    /* Hide category term on mobile */
    .single-product-wrapper .product-category-row {
        display: none !important;
    }

    .single-product-wrapper .gallery-thumbnails {
        position: static;
        inset: auto;
        width: auto;
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .single-product-wrapper .gallery-thumbs-nav {
        display: none !important;
    }

    .woocommerce-Price-amount {
        font-size: 23px;
    }

    /* Mobile gallery: horizontal scroll carousel (default) */
    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .product-gallery__track {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .product-gallery__track::-webkit-scrollbar {
        display: none;
    }

    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .gallery-slide {
        position: relative !important;
        display: block !important;
        /* Slides fill the padded track, so each snapped slide keeps the same 20px
           gutters as everything else. (They were undersized to compensate for the
           old full-bleed track, which would now leave a lopsided right edge.) */
        flex: 0 0 100%;
        width: 100% !important;
        max-width: 100%;
        min-height: 100%;
        height: auto;
        scroll-snap-align: start;
        scroll-snap-stop: normal;
        /* Horizontal carousel: keep every slide visible (no fade stack) */
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto;
        z-index: auto;
        transition: none;
    }

    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .gallery-slide img,
    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .gallery-slide .product-gallery-image {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100%;
        object-fit: cover !important;
        border-radius: var(--theme-radius-lg) !important;
    }

    body:not(.product-gallery-mobile-thumbnails) .single-product-wrapper .product-images .gallery-thumbnails {
        display: none !important;
    }

    /* Mobile gallery: thumbnails under main image (desktop-like) */
    body.product-gallery-mobile-thumbnails .single-product-wrapper .product-images .gallery-thumbnails {
        --qt-m-thumb-gap: 8px;
        --qt-m-thumb-count: 5; /* full thumbs visible; extra scroll cleanly */
        display: flex !important;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: var(--qt-m-thumb-gap);
        margin-top: 0;
        order: 2;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding-block: 2px; /* room for active border */
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 0;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .form-row.place-order {
        padding: 0 !important;
        border-top: none !important;
    }

    body.product-gallery-mobile-thumbnails .single-product-wrapper .product-gallery {
        order: 1;
    }

    body.product-gallery-mobile-thumbnails .single-product-wrapper .gallery-thumbnails__rail {
        display: contents;
    }

    body.product-gallery-mobile-thumbnails .single-product-wrapper .product-images .gallery-thumbnails::-webkit-scrollbar {
        display: none;
    }

    /* 4:5 thumbs sized so 5 fit fully — no half-cut thumbs at the edges */
    body.product-gallery-mobile-thumbnails .single-product-wrapper .gallery-thumb {
        --qt-m-thumb-w: calc(
            (100% - (var(--qt-m-thumb-count) - 1) * var(--qt-m-thumb-gap))
            / var(--qt-m-thumb-count)
        );
        width: var(--qt-m-thumb-w);
        height: auto;
        flex: 0 0 var(--qt-m-thumb-w);
        aspect-ratio: 4 / 5;
        max-width: none;
        opacity: 1;
        border-width: 2px;
        border-radius: var(--theme-radius-sm);
        scroll-snap-align: start;
    }

    .single-product-wrapper .gallery-nav {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 12;
        width: 36px;
        height: 36px;
        padding: 0;
        margin: 0;
        border: none;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.85);
        color: #1e293b;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
        cursor: pointer;
        line-height: 0;
        -webkit-tap-highlight-color: transparent;
    }
    .single-product-wrapper .gallery-nav--prev {
        inset-inline-start: 10px;
    }

    .single-product-wrapper .gallery-nav--next {
        inset-inline-end: 10px;
    }

    .single-product-wrapper .gallery-nav svg {
        display: block;
        flex-shrink: 0;
    }

    [dir="rtl"] .single-product-wrapper .gallery-nav svg {
        transform: scaleX(-1);
    }

    .single-product-wrapper .gallery-zoom-trigger {
        background: rgba(255, 255, 255, 0.45);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
        border: 1px solid rgba(255, 255, 255, 0.5);
    }

    .single-product-wrapper .qt-gallery-back {
        min-height: 36px;
        font-size: 13px;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: none;
        box-shadow: none;
    }

    [dir="rtl"] .single-product-wrapper .gallery-zoom-trigger {
        right: auto;
        left: 15px;
    }
}

/* ============================================
   WooCommerce Thank You Page (Order Received)
   ============================================ */
.woocommerce-order-received {
    --qt-field-border: #E2E8F0;
    --qt-field-border-w: 1.5px;
    --qt-field-radius: var(--theme-radius);
    --qt-field-shadow: -2px 5px 12.9px -9px rgba(157, 157, 157, 0.81);
    --qt-field-bg: #FFFFFF;
    --qt-field-text: #1E293B;
    --qt-label-color: #202020;
}

.woocommerce-order {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.woocommerce-order>* {
    margin: 0;
}

.woocommerce-order-overview {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
}

.woocommerce-order-overview li {
    margin: 0;
}

.woocommerce-order-details {
    margin: 0;
}

.woocommerce-order-details__title,
.woocommerce-order-details_title {
    margin: 0 0 12px;
    color: var(--qt-label-color);
}

/* Thank you page: no “Order details” heading above the table */
.woocommerce-order-received .woocommerce-order-details__title,
.woocommerce-order-received .woocommerce-order-details_title {
    display: none;
}

/* Thank you page: hide billing address block if anything still outputs it */
.woocommerce-order-received .woocommerce-customer-details {
    display: none !important;
}

/* WooCommerce shop tables — unified border color */
.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
    border-color: #E2E8F0;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td,
.woocommerce-page table.shop_table th,
.woocommerce-page table.shop_table td {
    border-color: #E2E8F0;
    padding: 20px;
}

/* Thank you / order-details table — one border token, taller rows */
.woocommerce-order-details .shop_table {
    --qt-od-border: #E2E8F0;
    --qt-od-border-w: 1px;
    display: table;
    width: 100%;
    margin: 0;
    border: var(--qt-od-border-w) solid var(--qt-od-border);
    border-radius: var(--qt-field-radius);
    background: var(--qt-field-bg, #fff);
    box-shadow: none;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.woocommerce-order-details .shop_table thead,
.woocommerce-order-details .shop_table tbody,
.woocommerce-order-details .shop_table tfoot {
    display: table-row-group;
    border: 0;
}

.woocommerce-order-details .shop_table tr {
    display: table-row;
    border: 0;
    background: transparent;
}

.woocommerce-order-details .shop_table thead tr {
    background: #f8fafc;
}

.woocommerce-order-details .shop_table thead th {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--qt-label-color);
}

.woocommerce-order-details .shop_table th,
.woocommerce-order-details .shop_table td {
    display: table-cell;
    vertical-align: middle;
    margin: 0;
    padding: 28px 20px;
    min-height: 64px;
    border: 0 !important;
    /* Row dividers use tr box-shadow so lines stay full-width (shipping/free rows
       were showing a half-line when only the label cell painted a border). */
    box-shadow: none !important;
    outline: none;
    color: var(--qt-field-text);
    word-wrap: break-word;
    line-height: 1.45;
}

.woocommerce-order-details .shop_table thead th {
    padding: 20px 20px;
}

.woocommerce-order-details .shop_table thead tr,
.woocommerce-order-details .shop_table tbody tr,
.woocommerce-order-details .shop_table tfoot tr:not(:last-child) {
    box-shadow: inset 0 -1px 0 var(--qt-od-border);
}

/* Drop divider on the last row only — outer frame already closes the table */
.woocommerce-order-details .shop_table tfoot tr:last-child {
    box-shadow: none;
}

.woocommerce-order-details .shop_table tfoot tr:last-child th,
.woocommerce-order-details .shop_table tfoot tr:last-child td {
    border-bottom: 0 !important;
}

.woocommerce-order-details .shop_table th:first-child,
.woocommerce-order-details .shop_table td:first-child {
    width: 58%;
    text-align: left;
    font-weight: 500;
}

/* Product rows: thumbnail + name */
.woocommerce-order-details .shop_table tbody td.product-name {
    font-weight: 500;
}

.woocommerce-order-details .qt-order-item {
    display: flex;
    align-items: center;
    gap: 14px;
    text-align: start;
}

.woocommerce-order-details .qt-order-item__thumb {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    border-radius: var(--theme-radius-sm, 8px);
    overflow: hidden;
    background: #f8fafc;
    border: var(--qt-od-border-w, 1px) solid var(--qt-od-border, #E2E8F0);
    box-shadow: none;
}

.woocommerce-order-details .qt-order-item__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.woocommerce-order-details .qt-order-item__info {
    min-width: 0;
    flex: 1;
}

.woocommerce-order-details .qt-order-item__info a {
    color: inherit;
    text-decoration: none;
}

.woocommerce-order-details .qt-order-item__info a:hover {
    text-decoration: underline;
}

.woocommerce-order-details .shop_table th:last-child,
.woocommerce-order-details .shop_table td:last-child {
    width: 42%;
    text-align: right;
    font-weight: 600;
}

/* Isolate currency amounts so RTL currency (د.ج) renders correctly on an LTR page
   and stays right-aligned. `.amount` is WooCommerce's price wrapper. */
.woocommerce-order-details .shop_table td .amount,
.woocommerce-order-details .shop_table td .woocommerce-Price-amount,
.woocommerce-customer-details .amount,
.woocommerce-customer-details .woocommerce-Price-amount {
    /* Override the global 26px product-page price rule that leaks in here. */
    display: inline-block;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-align: right;
    text-transform: none;
    color: inherit;
}

/* Total row keeps the emphasis (slightly larger + brand color). */
.woocommerce-order-details .shop_table tfoot tr.order_total .amount,
.woocommerce-order-details .shop_table tfoot tr.order_total .woocommerce-Price-amount {
    font-size: 15px;
    font-weight: 700;
    color: var(--primary-color, #17a2b8);
}

/* Product name row: let the "× 1" qty sit as muted secondary text. */
.woocommerce-order-details .shop_table td:first-child .product-quantity {
    color: var(--qt-label-color);
    opacity: 0.6;
    font-weight: 500;
}

/* Emphasize the Total row (not payment method). */
.woocommerce-order-details .shop_table tfoot tr.order_total th,
.woocommerce-order-details .shop_table tfoot tr.order_total td {
    font-size: 15px;
    font-weight: 700;
    color: var(--primary-color, #17a2b8);
}

/* Free shipping value on thank-you / order details */
.woocommerce-order-details .shop_table .qt-shipping-free {
    color: #16a34a;
    font-weight: 600;
}

.woocommerce-order-downloads {
    margin: 0;
}

.woocommerce-order-downloads_title {
    margin: 0 0 12px;
}

.woocommerce-order-downloads ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
}

.woocommerce-order-downloads li {
    margin: 0;
}

.woocommerce-customer-details {
    margin: 0;
}

.woocommerce-customer-details .woocommerce-columns {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.woocommerce-customer-details .woocommerce-column {
    flex: 1 1 320px;
}

.woocommerce-customer-details_title,
.woocommerce-column__title {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 700;
    color: var(--qt-label-color);
}

.woocommerce-customer-details address {
    margin: 0;
    padding: 16px 18px;
    border: var(--qt-field-border-w) solid var(--qt-field-border);
    border-radius: var(--qt-field-radius);
    background: var(--qt-field-bg);
    box-shadow: var(--qt-field-shadow);
    color: var(--qt-field-text);
    font-style: normal;
    line-height: 1.7;
    font-size: 14px;
}

/* First line of the address (customer name) stands out. */
.woocommerce-customer-details address {
    display: flex;
    flex-direction: column;
}

.woocommerce-customer-details .woocommerce-customer-details--phone,
.woocommerce-customer-details .woocommerce-customer-details--email {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    color: var(--qt-label-color);
}

.woocommerce-customer-details .woocommerce-customer-details--phone::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M6.5 3.5 10 8l-1.7 3c.3.8.9 1.9 1.9 2.9s2.1 1.6 2.9 1.9L16 13l4.5 3.5c-.9 1.6-2 2.7-3.6 3.6-4.8.2-8.9-2.4-11.7-5.7C3 12 2 8.5 2.7 5.6 3.6 4 4.8 2.9 6.5 3.5z'/></svg>") no-repeat center / contain;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M6.5 3.5 10 8l-1.7 3c.3.8.9 1.9 1.9 2.9s2.1 1.6 2.9 1.9L16 13l4.5 3.5c-.9 1.6-2 2.7-3.6 3.6-4.8.2-8.9-2.4-11.7-5.7C3 12 2 8.5 2.7 5.6 3.6 4 4.8 2.9 6.5 3.5z'/></svg>") no-repeat center / contain;
    flex-shrink: 0;
}

.woocommerce-thankyou-order-received {
    margin: 0;
}

.woocommerce-thankyou-order-received+* {
    margin-top: 0;
}

@media (max-width: 768px) {
    .woocommerce-order-details .shop_table th,
    .woocommerce-order-details .shop_table td {
        padding: 24px 16px;
    }

    .woocommerce-order-details .shop_table thead th {
        padding: 18px 16px;
    }

    .woocommerce-order-details .qt-order-item {
        gap: 12px;
    }

    .woocommerce-order-details .qt-order-item__thumb {
        width: 48px;
        height: 48px;
    }

    .woocommerce-customer-details .woocommerce-columns {
        gap: 12px;
    }

    .woocommerce-customer-details .woocommerce-column {
        flex: 1 1 100%;
    }
}

.acc-checkout-box {
    border: none !important;
}

.product-card .woocommerce-Price-amount.amount {
    font-size: 14px;
}

.product-category-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 6px;
}

.product-category-label {
    font-size: 12px;
    color: var(--primary-color);
    text-transform: capitalize;
    letter-spacing: 0px;
    font-weight: 600;
}

.product-category-label::after {
    content: ": ";
}

.product-category {
    font-size: 12px;
    color: #999;
    display: inline-block;
    margin: 0;
    text-transform: capitalize;
    letter-spacing: 0px;
    font-weight: 500;
}

/* ============================================
   WooCommerce Cart Page
   ============================================ */
body.woocommerce-cart {
    --qt-cart-border: color-mix(in srgb, var(--font-body, #333) 12%, transparent);
    --qt-cart-muted: #64748b;
    --qt-cart-heading: #1e293b;
}

.qt-cart-wrapper {
    max-width: 1388px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.qt-cart-form {
    flex: 1 1 65%;
    min-width: 300px;
}

/* Cart line items reuse mini-cart row layout (.qt-mini-cart-item*). */
.qt-cart-items {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #e5e5e5;
    border-radius: var(--theme-radius);
    background: #fff;
    overflow: hidden;
}

.qt-cart-items .qt-mini-cart-item {
    padding: 16px;
}

.qt-cart-items .qt-mini-cart-item:last-child {
    border-bottom: none;
}

.qt-remove-item {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--theme-radius-sm);
    background: #f8f8f8;
    color: #666;
    font-size: 24px;
    line-height: 1;
    transition: all 0.2s;
}

.qt-remove-item:hover {
    background: #ff4444;
    color: #fff;
}

.qt-cart-actions {
    margin-top: 16px;
    display: flex;
    gap: 12px;
}

.qt-update-cart {
    padding: 0 22px;
    min-height: 48px;
    background: var(--qt-field-bg, #fff);
    color: var(--primary-color);
    border-width: 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0);
    border-image: none;
    border-radius: max(var(--qt-field-radius, 8px), 10px);
    font-size: 15px;
    font-weight: 600;
    box-shadow: none;
    cursor: pointer;
    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease;
}

.qt-update-cart:hover {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--qt-field-bg, #fff));
    border-color: color-mix(in srgb, var(--primary-color) 55%, var(--qt-field-border, #e2e8f0));
}

.qt-update-cart:focus {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 22%, transparent);
}

.qt-update-cart:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.qt-cart-collaterals {
    flex: 1 1 30%;
    min-width: 300px;
}

.qt-cart-totals {
    background: #fff;
    border: 1px solid var(--qt-cart-border, #e2e8f0);
    border-radius: var(--theme-radius-lg, 12px);
    padding: 22px 22px 20px;
    position: sticky;
    top: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    box-sizing: border-box;
}

.qt-cart-totals h2 {
    font-size: 1.125rem;
    font-weight: var(--font-weight-headings, 600);
    margin: 0 0 18px;
    padding-bottom: 14px;
    color: var(--qt-cart-heading, #1e293b);
    letter-spacing: -0.02em;
    border-bottom: 1px solid var(--qt-cart-border, #e2e8f0);
}

.qt-cart-totals-inner {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 18px;
    padding-bottom: 0;
    border-bottom: none;
}

.qt-cart-subtotal,
.qt-cart-discount,
.qt-cart-fee,
.qt-cart-tax {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--qt-cart-border, #e2e8f0);
    font-size: 0.9375rem;
}

.qt-cart-subtotal > span:first-child,
.qt-cart-discount > span:first-child,
.qt-cart-fee > span:first-child,
.qt-cart-tax > span:first-child {
    color: var(--qt-cart-muted, #64748b);
    font-weight: 500;
}

.qt-cart-subtotal > span:last-child,
.qt-cart-discount > span:last-child,
.qt-cart-fee > span:last-child,
.qt-cart-tax > span:last-child {
    color: var(--qt-cart-heading, #1e293b);
    font-weight: 600;
    text-align: end;
    unicode-bidi: isolate;
}

/* Shipping block: full-width below subtotal (not a two-column flex row) */
.qt-cart-shipping-wrap {
    padding: 16px 0;
    border-bottom: 1px solid var(--qt-cart-border, #e2e8f0);
}

.qt-cart-shipping-wrap--calculator-only {
    padding-bottom: 8px;
}

.qt-cart-shipping-wrap .qt-shipping-package + .qt-shipping-package {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--qt-cart-border, #e2e8f0);
}

.qt-shipping-package {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qt-shipping-package__heading {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--qt-cart-muted, #64748b);
    margin: 0;
}

.qt-shipping-package__body {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

/* Shipping method cards — cart, order review, shell left-column slot */
.qt-cart-shipping-wrap .woocommerce-shipping-methods,
.qt-order-review .woocommerce-shipping-methods,
#order_review .woocommerce-shipping-methods,
.qt-checkout-shipping-slot .woocommerce-shipping-methods {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.qt-cart-shipping-wrap .woocommerce-shipping-methods li,
.qt-order-review .woocommerce-shipping-methods li,
#order_review .woocommerce-shipping-methods li,
.qt-checkout-shipping-slot .woocommerce-shipping-methods li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--qt-field-border, #e2e8f0);
    border-radius: var(--theme-radius, 8px);
    background: var(--qt-field-bg, #fff);
    box-shadow: var(--qt-field-shadow);
    transition:
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}

.qt-cart-shipping-wrap .woocommerce-shipping-methods li:has(.shipping_method:checked),
.qt-order-review .woocommerce-shipping-methods li:has(.shipping_method:checked),
#order_review .woocommerce-shipping-methods li:has(.shipping_method:checked),
.qt-checkout-shipping-slot .woocommerce-shipping-methods li:has(.shipping_method:checked) {
    border-color: color-mix(in srgb, var(--primary-color) 45%, var(--qt-field-border, #e2e8f0));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--primary-color) 25%, transparent),
        var(--qt-field-shadow);
}

.qt-cart-shipping-wrap .woocommerce-shipping-methods .shipping_method,
.qt-order-review .woocommerce-shipping-methods .shipping_method,
#order_review .woocommerce-shipping-methods .shipping_method,
.qt-checkout-shipping-slot .woocommerce-shipping-methods .shipping_method {
    margin: 0;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--primary-color);
}

.qt-cart-shipping-wrap .woocommerce-shipping-methods label,
.qt-order-review .woocommerce-shipping-methods label,
#order_review .woocommerce-shipping-methods label,
.qt-checkout-shipping-slot .woocommerce-shipping-methods label {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 6px 12px;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--qt-field-text, var(--qt-cart-heading, #1e293b));
    cursor: pointer;
    line-height: 1.35;
}

.qt-cart-shipping-wrap .woocommerce-shipping-methods label .woocommerce-Price-amount,
.qt-order-review .woocommerce-shipping-methods label .woocommerce-Price-amount,
#order_review .woocommerce-shipping-methods label .woocommerce-Price-amount,
.qt-checkout-shipping-slot .woocommerce-shipping-methods label .woocommerce-Price-amount,
.qt-cart-shipping-wrap .woocommerce-shipping-methods label .amount,
.qt-order-review .woocommerce-shipping-methods label .amount,
#order_review .woocommerce-shipping-methods label .amount,
.qt-checkout-shipping-slot .woocommerce-shipping-methods label .amount {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--qt-cart-muted, #64748b);
    white-space: nowrap;
    unicode-bidi: isolate;
    margin-inline-start: auto;
}

/* Checkout: >3 shipping methods → select (JS); hide radio list */
body.woocommerce-checkout .qt-order-review .woocommerce-shipping-methods.qt-shipping-as-select,
body.woocommerce-checkout #order_review .woocommerce-shipping-methods.qt-shipping-as-select,
body.woocommerce-checkout .qt-checkout-shipping-slot .woocommerce-shipping-methods.qt-shipping-as-select {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

body.woocommerce-checkout .qt-shipping-select-wrap {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    min-height: var(--qt-field-height, 47px);
    max-height: var(--qt-field-height, 47px);
    margin: 0 0 10px;
    border: var(--qt-field-border-w, 1.5px) solid var(--qt-field-border, #E2E8F0);
    border-radius: var(--qt-field-radius, var(--theme-radius));
    background: var(--qt-field-bg, #fff);
    box-shadow: var(--qt-field-shadow);
    overflow: hidden;
    box-sizing: border-box;
}

/* Single chevron via background (no extra SVG span — avoids doubled arrows). */
body.woocommerce-checkout .qt-shipping-select-wrap .qt-shipping-select,
body.woocommerce-checkout form.checkout .qt-shipping-select-wrap .qt-shipping-select {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: var(--qt-field-height, 47px);
    min-height: var(--qt-field-height, 47px);
    max-height: var(--qt-field-height, 47px);
    margin: 0;
    padding: 0 36px 0 12px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.24999 7.43933L12.25 14.4393L19.25 7.43933L20.3107 8.49999L12.25 16.5607L4.18933 8.49999L5.24999 7.43933Z' fill='%23334155'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
    background-position: right 12px center !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: var(--qt-checkout-input-weight, 500);
    color: var(--qt-field-text, #1E293B);
    box-sizing: border-box;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    cursor: pointer;
}

body.woocommerce-checkout .qt-shipping-select-wrap .qt-shipping-select::-ms-expand {
    display: none;
}

[dir="rtl"] body.woocommerce-checkout .qt-shipping-select-wrap .qt-shipping-select,
[dir="rtl"] body.woocommerce-checkout form.checkout .qt-shipping-select-wrap .qt-shipping-select {
    padding: 0 12px 0 36px !important;
    background-position: left 12px center !important;
}

/* Hide legacy chevron span if an older JS build still injects it */
body.woocommerce-checkout .qt-shipping-select-wrap .qt-shipping-select-chevron {
    display: none !important;
}

/* Checkout shipping row: leave table layout so colspan=2 stays full-width.
   display:block on the td was shrinking the select to ~half the card.
   The shared .qt-shipping-package rule sets display:flex (correct for the cart,
   where it's a <div>); on checkout that same class lands on the <tr>, which
   breaks the table so colspan=2 is ignored and the select collapses to a narrow
   box — force the row back to table-row. */
body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals.qt-shipping-package,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals.qt-shipping-package,
body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals {
    display: table-row;
}
/* Method picker (left column / full-width package row) */
body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals.qt-shipping-package > td,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals.qt-shipping-package > td {
    display: table-cell;
    width: 100%;
    padding: 12px 0;
    border-bottom: 0 !important;
    text-align: start !important;
}
/* Summary “Expédition” amount — align with other totals */
body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals.qt-shipping-totals--summary > th,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals.qt-shipping-totals--summary > th {
    text-align: start;
}
/* Keep border on both cells — zeroing only the <td> left a half-width line under Expédition. */
body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals.qt-shipping-totals--summary > td,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals.qt-shipping-totals--summary > td {
    display: table-cell;
    padding: 12px 0;
    text-align: end !important;
    white-space: nowrap;
}

body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals .qt-shipping-package__body,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals .qt-shipping-package__body {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

body.woocommerce-checkout .qt-order-review tr.woocommerce-shipping-totals .qt-shipping-package__heading,
body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals .qt-shipping-package__heading {
    margin-bottom: 8px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--qt-label-color, #334155);
}

.qt-shipping-destination {
    margin: 0;
    padding: 12px 14px;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--qt-cart-muted, #64748b);
    background: color-mix(in srgb, var(--font-body, #333) 4%, transparent);
    border-radius: var(--theme-radius-sm, 4px);
    border: 1px solid var(--qt-cart-border, #e2e8f0);
    unicode-bidi: plaintext;
}

.qt-shipping-destination strong {
    color: var(--qt-cart-heading, #1e293b);
    font-weight: 600;
}

.qt-shipping-contents {
    margin: 0;
    color: var(--qt-cart-muted, #64748b);
}

.qt-shipping-calculator-wrap .shipping-calculator-form,
.qt-cart-shipping-wrap .shipping-calculator-form {
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px dashed var(--qt-cart-border, #e2e8f0);
}

.qt-cart-shipping-wrap .shipping-calculator-button {
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--primary-color);
    text-decoration: none;
    cursor: pointer;
    margin-top: 4px;
}

.qt-cart-shipping-wrap .shipping-calculator-button:hover {
    text-decoration: underline;
}

body.woocommerce-cart .qt-cart-shipping-wrap .shipping-calculator-form .input-text,
body.woocommerce-cart .qt-cart-shipping-wrap .shipping-calculator-form select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    padding: 8px 12px;
    margin-bottom: 10px;
    border: 1.5px solid var(--qt-field-border, #e2e8f0);
    border-radius: var(--qt-field-radius, var(--theme-radius));
    background: var(--qt-field-bg, #fff);
    font-size: 0.875rem;
    box-shadow: var(--qt-field-shadow);
}

body.woocommerce-cart .qt-cart-shipping-wrap .shipping-calculator-form .button {
    min-height: 44px;
    padding: 0 20px;
    border-radius: var(--qt-field-radius, var(--theme-radius));
    background: var(--primary-color);
    color: #fff;
    border: none;
    font-weight: 600;
    cursor: pointer;
}

.qt-cart-total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    margin-top: 4px;
    padding: 16px 0 4px;
    border-top: 2px solid var(--qt-cart-border, #e2e8f0);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--qt-cart-heading, #1e293b);
}

.qt-cart-total > span:last-child {
    text-align: end;
    unicode-bidi: isolate;
}

.qt-proceed-checkout {
    margin-top: 8px;
}

/* Cart proceed — parity with QuickFORM .qf-submit / #place_order */
.qt-proceed-checkout .checkout-button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 50px;
    padding: 20px!important;
    border: none;
    border-radius: var(--qf-radius, var(--qt-field-radius, 6px)) !important;
    background: var(--qf-theme, var(--qt-checkout-accent, var(--primary-color))) !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 2;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    transition: opacity 0.2s;
    position: relative;
    overflow: hidden !important;
    isolation: isolate;
    animation: 5s infinite qt-qf-shake-every-5s;
}

.qt-proceed-checkout .checkout-button::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 80px !important;
    height: 100% !important;
    background: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 20%,
        rgba(255, 255, 255, 0.45) 50%,
        rgba(255, 255, 255, 0) 80%
    ) !important;
    transform: translateX(-120%);
    animation: 2.4s ease-in-out infinite qt-qf-shiny-slide !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

.qt-proceed-checkout .checkout-button > * {
    position: relative;
    z-index: 1;
}

.qt-proceed-checkout .checkout-button:hover {
    opacity: 0.9;
}

.qt-proceed-checkout .checkout-button:focus {
    outline: none;
}

.qt-proceed-checkout .checkout-button:focus-visible {
    outline: 2px solid var(--qf-theme, var(--qt-checkout-accent, var(--primary-color)));
    outline-offset: 3px;
}

.qt-proceed-checkout .checkout-button:active {
	opacity: 0.95;
}

/* Remove loader from add-to-cart button */
.qf-add-to-cart .loader,
.qf-add-to-cart.adding-to-cart .loader {
	display: none !important;
}

/* Place-order spinner — same clip-path animation as the add-to-cart loader, theme color */
.qf-spinner {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	position: relative;
	border: none;
	background: none;
	animation: qf-atc-loader-rotate 1s linear infinite;
}

.qf-spinner::before {
	content: "";
	box-sizing: border-box;
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 3px solid var(--primary-color, #0a0101);
	animation: qf-atc-loader-prixClipFix 2s linear infinite;
}

/* Cart coupon row (injected via woocommerce_cart_actions or plugins) — QuickFORM-style */
body.woocommerce-cart .qt-cart-form .coupon,
body.woocommerce-cart form.woocommerce-cart-form .coupon {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 12px;
    margin-top: 12px;
}

body.woocommerce-cart .qt-cart-form .coupon label,
body.woocommerce-cart form.woocommerce-cart-form .coupon label {
    flex: 1 1 100%;
    font-size: 14px;
    color: #334155;
    cursor: pointer;
}

body.woocommerce-cart .qt-cart-form .coupon .input-text,
body.woocommerce-cart form.woocommerce-cart-form .coupon .input-text {
    flex: 1 1 200px;
    min-width: 0;
    min-height: 48px;
    padding: 8px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: var(--qt-field-radius);
    background: #fff;
    color: #1e293b;
    font-size: 14px;
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
}

body.woocommerce-cart .qt-cart-form .coupon .input-text:focus,
body.woocommerce-cart form.woocommerce-cart-form .coupon .input-text:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.5px var(--primary-color), var(--qt-field-shadow);
    outline: none;
}

body.woocommerce-cart .qt-cart-form .coupon .button,
body.woocommerce-cart .qt-cart-form .coupon button[type="submit"],
body.woocommerce-cart form.woocommerce-cart-form .coupon .button,
body.woocommerce-cart form.woocommerce-cart-form .coupon button[type="submit"] {
    flex: 0 0 auto;
    min-height: 48px;
    padding: 0 22px;
    margin: 0;
    border: none;
    border-radius: var(--qt-field-radius);
    background: var(--primary-color);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    line-height: 1.2;
    box-shadow: var(--qt-field-shadow);
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.1s ease;
}

body.woocommerce-cart .qt-cart-form .coupon .button:hover,
body.woocommerce-cart form.woocommerce-cart-form .coupon .button:hover {
    opacity: 0.9;
}

body.woocommerce-cart .qt-cart-form .coupon .button:focus,
body.woocommerce-cart form.woocommerce-cart-form .coupon .button:focus {
    outline: none;
    box-shadow: 0 0 0 0.5px var(--primary-color), var(--qt-field-shadow);
}

/* Empty Cart */
.qt-empty-cart {
    max-width: 600px;
    margin: 80px auto;
    padding: 60px 20px;
    text-align: center;
}

.qt-empty-cart-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    color: #ccc;
    line-height: 0;
}
.qt-empty-cart-icon svg {
    display: block;
    width: 80px;
    height: 80px;
}

.qt-empty-cart-icon .qt-heart-fill {
    display: none;
}

.qt-empty-cart-message {
    font-size: 20px;
    color: #666;
    margin-bottom: 32px;
}

.qt-return-shop {
    display: inline-block;
    padding: 0 40px;
    min-height: 48px;
    line-height: 48px;
    background: var(--primary-color);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--qt-field-radius);
    box-shadow: var(--qt-field-shadow);
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.1s ease;
    text-decoration: none;
    vertical-align: middle;
}

.qt-return-shop:hover {
    opacity: 0.9;
    color: #fff;
}

.qt-return-shop:focus {
    outline: none;
    box-shadow: 0 0 0 0.5px var(--primary-color), var(--qt-field-shadow);
}

.shop-main .qt-empty-state,
.shop-page-wrapper > .qt-empty-state {
    margin: 48px auto;
    padding: 40px 20px;
}

/* Categories Slider Responsive */
@media (max-width: 1024px) {
    .category-slide {
        flex: 0 0 calc(33.333% - 20px);
        min-width: calc(33.333% - 20px);
    }

    .category-image {
        width: 140px;
        height: 140px;
    }
}

@media (max-width: 768px) {
    .categories-slider-section {
        padding: 30px 15px;
    }

    .categories-title {
        font-size: 28px;
    }

    .categories-slider {
        margin: 0 50px;
    }

    .categories-track {
        gap: 20px;
    }

    .category-slide {
        flex: 0 0 calc(50% - 10px);
        min-width: calc(50% - 10px);
    }

    .category-image {
        width: 120px;
        height: 120px;
        margin-bottom: 12px;
    }

.category-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    text-align: center;
    margin: 12px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.category-name__count {
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    white-space: nowrap;
}

    .category-count {
        font-size: 13px;
    }

    .slider-nav {
        width: 36px;
        height: 36px;
    }

    .slider-nav svg {
        width: 18px;
        height: 18px;
    }
}

@media (max-width: 480px) {
    .categories-title {
        font-size: 24px;
    }

    .categories-slider {
        margin: 0 45px;
    }

    .category-slide {
        flex: 0 0 100%;
        min-width: 100%;
    }

    .category-image {
        width: 140px;
        height: 140px;
    }

    .slider-nav {
        width: 32px;
        height: 32px;
    }
}

/* Cart Responsive */
@media (max-width: 768px) {
    .qt-cart-wrapper {
        flex-direction: column;
    }

    .qt-cart-form,
    .qt-cart-collaterals {
        flex: 1 1 100%;
    }

    .qt-cart-totals {
        position: static;
    }
}

/* ============================================
   Wishlist / Favoris (YITH) — match cart card UI
   ============================================ */
body.qt-wishlist-page {
    --qt-cart-border: color-mix(in srgb, var(--font-body, #333) 12%, transparent);
    --qt-cart-muted: #64748b;
    --qt-cart-heading: #1e293b;
}

body.qt-wishlist-page .container {
    padding-top: 0;
}

body.qt-wishlist-page .entry-content {
    max-width: 860px;
    margin: 0 auto;
}

body.qt-wishlist-page .yith-wcwl-form {
    margin: 0;
}

body.qt-wishlist-page .wishlist-title-container,
body.qt-wishlist-page .wishlist-title {
    display: none !important;
}

/* Desktop table → card list */
body.qt-wishlist-page table.wishlist_table {
    display: block;
    width: 100%;
    margin: 0;
    border: none !important;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
    box-shadow: none;
}

body.qt-wishlist-page table.wishlist_table thead {
    display: none;
}

body.qt-wishlist-page table.wishlist_table tbody,
body.qt-wishlist-page table.wishlist_table tbody.wishlist-items-wrapper {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.qt-wishlist-page table.wishlist_table tr {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr) auto;
    gap: 12px 16px;
    align-items: center;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 16px;
    box-sizing: border-box;
    border: 1px solid #e5e5e5;
    border-radius: var(--theme-radius);
    background: #fff;
}

body.qt-wishlist-page table.wishlist_table td {
    display: block;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    vertical-align: middle;
}

body.qt-wishlist-page table.wishlist_table td.product-checkbox {
    position: absolute;
    top: 12px;
    inset-inline-start: 12px;
    z-index: 2;
}

body.qt-wishlist-page table.wishlist_table td.product-remove {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    inset-inline-start: auto;
    bottom: auto;
    z-index: 2;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

body.qt-wishlist-page table.wishlist_table td.product-thumbnail {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 80px;
}

body.qt-wishlist-page table.wishlist_table td.product-name {
    grid-column: 2;
    grid-row: 1;
    padding-inline-end: 40px !important;
}

body.qt-wishlist-page table.wishlist_table td.product-price {
    grid-column: 2;
    grid-row: 2;
}

body.qt-wishlist-page table.wishlist_table td.product-quantity,
body.qt-wishlist-page table.wishlist_table td.product-stock-status {
    grid-column: 3;
    grid-row: 1 / span 2;
    justify-self: end;
    align-self: center;
}

body.qt-wishlist-page table.wishlist_table td.product-add-to-cart,
body.qt-wishlist-page table.wishlist_table td.product-arrange {
    grid-column: 1 / -1;
    grid-row: auto;
}

body.qt-wishlist-page table.wishlist_table td.wishlist-empty,
body.qt-wishlist-page .wishlist-empty {
    /* Fallback only — empty state is rendered by quicktheme_wishlist_empty_state */
    display: none !important;
}

/* Hide YITH empty table / share chrome when our empty state is shown */
body.qt-wishlist-page:has(.qt-empty-state--wishlist) .yith-wcwl-form,
body.qt-wishlist-page:has(.qt-empty-state--wishlist) .yith_wcwl_wishlist_footer,
body.qt-wishlist-page:has(.qt-empty-state--wishlist) .yith-wcwl-share,
body.qt-wishlist-page:has(.wishlist-empty) .yith-wcwl-form,
body.qt-wishlist-page:has(.wishlist-empty) .yith_wcwl_wishlist_footer,
body.qt-wishlist-page:has(.wishlist-empty) .yith-wcwl-share {
    display: none !important;
}

body.qt-wishlist-page .qt-empty-state--wishlist {
    margin-top: 24px;
    margin-bottom: 40px;
}

/* Mobile list → same cards */
body.qt-wishlist-page ul.wishlist_table {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    border: none;
    background: transparent;
}

body.qt-wishlist-page ul.wishlist_table > li {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 12px 16px;
    position: relative;
    margin: 0;
    padding: 16px;
    border: 1px solid #e5e5e5;
    border-radius: var(--theme-radius);
    background: #fff;
}

body.qt-wishlist-page ul.wishlist_table .item-wrapper {
    display: contents;
}

body.qt-wishlist-page ul.wishlist_table .product-thumbnail {
    grid-column: 1;
    grid-row: 1 / span 2;
}

body.qt-wishlist-page ul.wishlist_table .item-details {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    padding-inline-end: 36px;
}

body.qt-wishlist-page ul.wishlist_table .additional-info-wrapper {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

body.qt-wishlist-page ul.wishlist_table .product-remove {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    inset-inline-start: auto;
    bottom: auto;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

body.qt-wishlist-page ul.wishlist_table table.item-details-table,
body.qt-wishlist-page ul.wishlist_table table.additional-info {
    width: 100%;
    border: none;
    margin: 0;
}

body.qt-wishlist-page ul.wishlist_table table.item-details-table td,
body.qt-wishlist-page ul.wishlist_table table.additional-info td {
    border: none;
    padding: 0 0 4px;
    background: transparent;
    font-size: 13px;
}

body.qt-wishlist-page ul.wishlist_table table.item-details-table td.label,
body.qt-wishlist-page ul.wishlist_table table.additional-info td.label {
    display: none;
}

/* Shared item chrome */
body.qt-wishlist-page .wishlist_table .product-thumbnail a,
body.qt-wishlist-page .wishlist_table .product-thumbnail {
    display: block;
    width: 80px;
    height: 80px;
    border-radius: var(--theme-radius-sm);
    overflow: hidden;
    background: #f8f8f8;
}

body.qt-wishlist-page .wishlist_table .product-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

body.qt-wishlist-page .wishlist_table .product-name,
body.qt-wishlist-page .wishlist_table .product-name h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--qt-cart-heading);
}

body.qt-wishlist-page .wishlist_table .product-name a {
    color: var(--qt-cart-heading);
    text-decoration: none;
    transition: color 0.2s;
}

body.qt-wishlist-page .wishlist_table .product-name a:hover {
    color: var(--primary-color);
}

body.qt-wishlist-page .wishlist_table .product-price,
body.qt-wishlist-page .wishlist_table .item-details-table .value {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 8px;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1.3;
    color: var(--qt-cart-heading) !important;
}

body.qt-wishlist-page .wishlist_table .product-price > .price,
body.qt-wishlist-page .wishlist_table .item-details-table .value > .price {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 8px;
    margin: 0;
}

/* Override global .woocommerce-Price-amount { display:flex } that stacks range prices */
body.qt-wishlist-page .wishlist_table .product-price .woocommerce-Price-amount,
body.qt-wishlist-page .wishlist_table .product-price .woocommerce-Price-amount bdi,
body.qt-wishlist-page .wishlist_table .item-details-table .value .woocommerce-Price-amount,
body.qt-wishlist-page .wishlist_table .item-details-table .value .woocommerce-Price-amount bdi {
    display: inline-flex !important;
    align-items: baseline;
    flex-wrap: nowrap;
    font-size: inherit !important;
    font-weight: inherit;
    line-height: inherit;
    text-align: start;
    text-transform: none;
    color: inherit !important;
}

body.qt-wishlist-page .wishlist_table .product-price del,
body.qt-wishlist-page .wishlist_table .item-details-table del {
    display: inline-flex;
    align-items: baseline;
    order: 2;
    font-size: calc(15px + 2px) !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    text-decoration: line-through;
    opacity: 0.7;
}

body.qt-wishlist-page .wishlist_table .product-price del *,
body.qt-wishlist-page .wishlist_table .item-details-table del * {
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    text-decoration: inherit;
}

body.qt-wishlist-page .wishlist_table .product-price ins,
body.qt-wishlist-page .wishlist_table .item-details-table ins {
    display: inline-flex;
    align-items: baseline;
    order: 1;
    text-decoration: none !important;
    color: var(--primary-color) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

body.qt-wishlist-page .wishlist_table .product-price ins *,
body.qt-wishlist-page .wishlist_table .item-details-table ins * {
    text-decoration: none !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
}

body.qt-wishlist-page .wishlist-in-stock,
body.qt-wishlist-page .wishlist-out-of-stock {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

body.qt-wishlist-page .wishlist-in-stock {
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #86efac;
}

body.qt-wishlist-page .wishlist-out-of-stock {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

body.qt-wishlist-page .wishlist_table .remove_from_wishlist,
body.qt-wishlist-page .wishlist_table a.remove {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    margin: 0;
    padding: 0 !important;
    border: none !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    color: #000 !important;
    font-size: 0;
    line-height: 0;
    text-decoration: none;
    box-sizing: border-box;
    aspect-ratio: 1 / 1;
    transition: opacity 0.2s;
}

body.qt-wishlist-page .wishlist_table .remove_from_wishlist svg,
body.qt-wishlist-page .wishlist_table a.remove svg {
    width: 18px;
    height: 18px;
    display: block;
    flex-shrink: 0;
    stroke: currentColor !important;
    fill: none !important;
    color: #000;
}

body.qt-wishlist-page .wishlist_table .remove_from_wishlist:hover,
body.qt-wishlist-page .wishlist_table a.remove:hover {
    background: transparent !important;
    border: none !important;
    color: #000 !important;
    opacity: 0.55;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart {
    margin: 0;
    padding: 0;
    text-align: start;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart .dateadded {
    display: none;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart .button,
body.qt-wishlist-page .wishlist_table .product-add-to-cart a.button,
body.qt-wishlist-page .wishlist_table .product-add-to-cart a.add_to_cart_button,
body.qt-wishlist-page .wishlist_table .product-add-to-cart a.product_type_simple,
body.qt-wishlist-page .wishlist_table .product-add-to-cart a.product_type_variable,
body.qt-wishlist-page .wishlist_table .product-add-to-cart > a,
body.qt-wishlist-page .yith_wcwl_footer_additional_action input[type="submit"],
body.qt-wishlist-page .yith_wcwl_wishlist_update .button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 18px !important;
    margin: 0;
    border: none !important;
    border-radius: var(--theme-radius);
    background: var(--primary-color) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1 !important;
    text-align: center;
    text-decoration: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    cursor: pointer;
    transition: opacity 0.2s;
    vertical-align: middle;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart .button::before,
body.qt-wishlist-page .wishlist_table .product-add-to-cart .button::after,
body.qt-wishlist-page .wishlist_table .product-add-to-cart > a::before,
body.qt-wishlist-page .wishlist_table .product-add-to-cart > a::after {
    display: none !important;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart .button i,
body.qt-wishlist-page .wishlist_table .product-add-to-cart .button .fa,
body.qt-wishlist-page .wishlist_table .product-add-to-cart > a i {
    display: none !important;
}

body.qt-wishlist-page .wishlist_table .product-add-to-cart .button:hover,
body.qt-wishlist-page .wishlist_table .product-add-to-cart > a:hover,
body.qt-wishlist-page .yith_wcwl_footer_additional_action input[type="submit"]:hover {
    opacity: 0.9;
    color: #fff !important;
}

/* Hide YITH “Partager sur” social share row on the wishlist page */
body.qt-wishlist-page .yith-wcwl-share,
body.qt-wishlist-page .yith_wcwl_wishlist_footer .yith-wcwl-share {
    display: none !important;
}

/* Wishlist footer (without share) */
body.qt-wishlist-page .yith_wcwl_wishlist_footer {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

/* Mobile: compact cart-like row + full-width CTA */
@media (max-width: 768px) {
    body.qt-wishlist-page .entry-content {
        max-width: none;
    }

    body.qt-wishlist-page table.wishlist_table tbody,
    body.qt-wishlist-page table.wishlist_table tbody.wishlist-items-wrapper,
    body.qt-wishlist-page ul.wishlist_table {
        gap: 12px;
    }

    body.qt-wishlist-page table.wishlist_table tr,
    body.qt-wishlist-page ul.wishlist_table > li {
        grid-template-columns: 72px minmax(0, 1fr);
        grid-template-rows: auto auto auto auto;
        gap: 6px 12px;
        align-items: start;
        padding: 12px;
        background: #fff;
    }

    body.qt-wishlist-page table.wishlist_table td.product-thumbnail,
    body.qt-wishlist-page ul.wishlist_table .product-thumbnail {
        grid-column: 1;
        grid-row: 1 / span 3;
        width: 72px;
        align-self: start;
    }

    body.qt-wishlist-page .wishlist_table .product-thumbnail,
    body.qt-wishlist-page .wishlist_table .product-thumbnail a {
        width: 72px;
        height: 90px;
        border-radius: var(--theme-radius-sm);
    }

    body.qt-wishlist-page table.wishlist_table td.product-name,
    body.qt-wishlist-page ul.wishlist_table .item-details {
        grid-column: 2;
        grid-row: 1;
        padding-inline-end: 36px !important;
        min-width: 0;
    }

    body.qt-wishlist-page .wishlist_table .product-name,
    body.qt-wishlist-page .wishlist_table .product-name h3 {
        font-size: 14px;
        font-weight: 600;
        line-height: 1.3;
    }

    body.qt-wishlist-page table.wishlist_table td.product-price {
        grid-column: 2;
        grid-row: 2;
        margin: 0;
    }

    body.qt-wishlist-page ul.wishlist_table .item-details-table {
        margin-top: 4px;
    }

    body.qt-wishlist-page .wishlist_table .product-price,
    body.qt-wishlist-page .wishlist_table .item-details-table .value {
        font-size: 14px !important;
    }

    body.qt-wishlist-page .wishlist_table .product-price del,
    body.qt-wishlist-page .wishlist_table .item-details-table del {
        font-size: calc(14px + 2px) !important;
    }

    body.qt-wishlist-page .wishlist_table .product-price ins,
    body.qt-wishlist-page .wishlist_table .item-details-table ins {
        font-size: 14px !important;
    }

    body.qt-wishlist-page table.wishlist_table td.product-quantity,
    body.qt-wishlist-page table.wishlist_table td.product-stock-status {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
        align-self: start;
    }

    body.qt-wishlist-page ul.wishlist_table .additional-info-wrapper {
        grid-column: 1 / -1;
        grid-row: 4;
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
        width: 100%;
        margin-top: 4px;
        padding-top: 10px;
        border-top: 1px solid #f1f5f9;
    }

    body.qt-wishlist-page ul.wishlist_table .additional-info {
        order: 1;
    }

    body.qt-wishlist-page ul.wishlist_table .product-add-to-cart {
        order: 2;
        width: 100%;
    }

    body.qt-wishlist-page ul.wishlist_table .move-to-another-wishlist {
        display: none;
    }

    body.qt-wishlist-page table.wishlist_table td.product-add-to-cart,
    body.qt-wishlist-page table.wishlist_table td.product-arrange {
        grid-column: 1 / -1;
        grid-row: 4;
        width: 100%;
        margin-top: 4px;
        padding-top: 10px !important;
        border-top: 1px solid #f1f5f9;
    }

    body.qt-wishlist-page table.wishlist_table td.product-arrange {
        display: none;
    }

    body.qt-wishlist-page .wishlist-in-stock,
    body.qt-wishlist-page .wishlist-out-of-stock {
        padding: 3px 8px;
        font-size: 11px;
    }

    body.qt-wishlist-page .wishlist_table .product-add-to-cart .button,
    body.qt-wishlist-page .wishlist_table .product-add-to-cart a.button,
    body.qt-wishlist-page .wishlist_table .product-add-to-cart a.add_to_cart_button,
    body.qt-wishlist-page .wishlist_table .product-add-to-cart a.product_type_simple,
    body.qt-wishlist-page .wishlist_table .product-add-to-cart a.product_type_variable,
    body.qt-wishlist-page .wishlist_table .product-add-to-cart > a {
        width: 100%;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        font-size: 14px !important;
        padding: 0 16px !important;
        line-height: 1 !important;
    }

    body.qt-wishlist-page .wishlist_table .remove_from_wishlist,
    body.qt-wishlist-page .wishlist_table a.remove {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        max-width: 28px !important;
        max-height: 28px !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 0;
        background: transparent !important;
        color: #000 !important;
    }

    body.qt-wishlist-page .wishlist_table .remove_from_wishlist svg,
    body.qt-wishlist-page .wishlist_table a.remove svg {
        width: 16px;
        height: 16px;
    }

    body.qt-wishlist-page table.wishlist_table td.product-remove,
    body.qt-wishlist-page ul.wishlist_table .product-remove {
        top: 12px;
        inset-inline-end: 12px;
        inset-inline-start: auto;
        bottom: auto;
        width: 28px;
        height: 28px;
    }

    body.qt-wishlist-page .yith_wcwl_wishlist_footer {
        margin-top: 20px;
        padding-top: 16px;
    }
}

/* ============================================
   WooCommerce Checkout Page
   Matches QuickFORM field shell (qf-public.css): 1.5px #E2E8F0, theme radius (--theme-radius), Figma shadow, 47px min-height.
   --qt-checkout-accent is set on body.woocommerce-checkout in wp_head (QuickFORM theme color or theme primary).
   No PDP icon rails — plain WC labels + inputs only.
   ============================================ */
body.woocommerce-checkout {
    --qt-field-border: #E2E8F0;
    --qt-field-border-w: 1.5px;
    --qt-field-radius: var(--theme-radius);
    --qt-field-shadow: -2px 5px 12.9px -9px rgba(157, 157, 157, 0.81);
    --qt-field-bg: #FFFFFF;
    --qt-field-text: #1E293B;
    --qt-label-color: #334155;
    --qt-placeholder: #94A3B8;
    --qt-checkout-input-weight: 500;
    --qt-field-height: 47px;
}

.qt-checkout-form {
    max-width: 1388px;
}

body.woocommerce-checkout .woocommerce-form-coupon .input-text,
body.woocommerce-checkout form.checkout_coupon .input-text {
    width: 100%;
    box-sizing: border-box;
    min-height: var(--qt-field-height);
    height: var(--qt-field-height);
    max-height: var(--qt-field-height);
    padding: 8px 12px;
    border: var(--qt-field-border-w) solid var(--qt-field-border) !important;
    border-radius: var(--qt-field-radius);
    background: var(--qt-field-bg);
    color: var(--qt-field-text);
    font-size: 14px;
    font-weight: var(--qt-checkout-input-weight);
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
}

body.woocommerce-checkout .woocommerce-form-coupon .input-text:focus,
body.woocommerce-checkout form.checkout_coupon .input-text:focus {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
    outline: none;
}

/* Checkout coupon row — QuickFORM-style primary button (#qf-apply-coupon): accent fill, radius, soft shadow */
body.woocommerce-checkout form.checkout_coupon,
body.woocommerce-checkout #woocommerce-checkout-form-coupon {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 10px;
    align-items: stretch;
    max-width: 300px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0;
    border-width: 0;
    height: fit-content;
}

body.woocommerce-checkout form.checkout_coupon .form-row {
    margin: 0;
    padding: 0;
}

body.woocommerce-checkout form.checkout_coupon .form-row.form-row-first {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex: 0 0 auto;
    min-width: 0;
    width: 100%;
}

body.woocommerce-checkout form.checkout_coupon .form-row.form-row-last {
    flex: 0 0 auto;
    width: 100%;
}

body.woocommerce-checkout form.checkout_coupon .clear {
    display: none;
}

body.woocommerce-checkout form.checkout_coupon button.button,
body.woocommerce-checkout form.checkout_coupon button[type="submit"],
body.woocommerce-checkout form.checkout_coupon button[name="apply_coupon"] {
    width: 100%;
    box-sizing: border-box;
    min-height: var(--qt-field-height);
    height: var(--qt-field-height);
    padding: 0 22px;
    margin: 0;
    border: none;
    border-radius: var(--qt-field-radius);
    background: var(--qt-checkout-accent, var(--primary-color));
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    line-height: 1.2;
    box-shadow: var(--qt-field-shadow);
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.1s ease;
}

body.woocommerce-checkout form.checkout_coupon button.button:hover,
body.woocommerce-checkout form.checkout_coupon button[type="submit"]:hover {
    opacity: 0.9;
}

body.woocommerce-checkout form.checkout_coupon button.button:focus,
body.woocommerce-checkout form.checkout_coupon button[type="submit"]:focus {
    outline: none;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
}

.qt-checkout-wrapper {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.qt-checkout-billing {
    flex: 1 1 55%;
    min-width: 300px;
}

.qt-checkout-billing h3,
.qt-checkout-review h3,
.qt-checkout-form .woocommerce-billing-fields > h3,
.qt-checkout-form #order_review_heading {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 16px;
    color: #1E293B;
}

/* Stack sections (billing block, shipping block); inside each, rows flow like WooCommerce (first+last side by side) */
.qt-checkout-billing .woocommerce-billing-fields,
.qt-checkout-shipping {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.qt-checkout-billing .woocommerce-billing-fields__field-wrapper,
.qt-checkout-form .woocommerce-billing-fields__field-wrapper,
.qt-checkout-billing .woocommerce-shipping-fields__field-wrapper,
.qt-checkout-form .woocommerce-shipping-fields__field-wrapper,
.qt-checkout-shipping .woocommerce-shipping-fields__field-wrapper,
.qt-checkout-form .woocommerce-additional-fields__field-wrapper,
.qt-checkout-shipping .woocommerce-additional-fields__field-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
}

.qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row,
.qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row,
.qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row {
    flex: 1 1 100%;
    max-width: 100%;
    margin-bottom: 0;
    margin-top: 0;
}

/* Full-width rows (country, address, etc.) */
.qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row.form-row-wide,
.qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row.form-row-wide,
.qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row.form-row-wide {
    flex: 1 1 100%;
    max-width: 100%;
}

/* Pair first/last name (and other WC .form-row-first / .form-row-last pairs) on one row */
.qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row.form-row-first,
.qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row.form-row-last,
.qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row.form-row-first,
.qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row.form-row-last,
.qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row.form-row-first,
.qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row.form-row-last {
    flex: 1 1 calc(50% - 8px);
    max-width: calc(50% - 8px);
    min-width: 0;
}

@media (max-width: 480px) {
    .qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row.form-row-first,
    .qt-checkout-form .woocommerce-billing-fields__field-wrapper > .form-row.form-row-last,
    .qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row.form-row-first,
    .qt-checkout-form .woocommerce-shipping-fields__field-wrapper > .form-row.form-row-last,
    .qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row.form-row-first,
    .qt-checkout-form .woocommerce-additional-fields__field-wrapper > .form-row.form-row-last {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

/* QuickFORM-matched field shells (same metrics as .qf-field inner inputs) */
.qt-checkout-billing input[type="text"],
.qt-checkout-billing input[type="email"],
.qt-checkout-billing input[type="tel"],
.qt-checkout-billing input[type="number"],
.qt-checkout-billing input[type="password"],
.qt-checkout-billing input[type="url"],
.qt-checkout-billing input.input-text,
.qt-checkout-billing select,
.qt-checkout-billing select.select,
.qt-checkout-billing textarea,
.qt-checkout-billing .form-row input[type="text"],
.qt-checkout-billing .form-row input[type="email"],
.qt-checkout-billing .form-row input[type="tel"],
.qt-checkout-billing .form-row input[type="number"],
.qt-checkout-billing .form-row input[type="password"],
.qt-checkout-billing .form-row input[type="url"],
.qt-checkout-billing .form-row input.input-text,
.qt-checkout-billing .form-row select,
.qt-checkout-billing .form-row textarea,
.qt-checkout-billing .woocommerce-input-wrapper input,
.qt-checkout-billing .woocommerce-input-wrapper select,
.qt-checkout-billing .woocommerce-input-wrapper textarea {
    width: 100%;
    min-height: var(--qt-field-height);
    padding: 8px 12px;
    border: var(--qt-field-border-w) solid var(--qt-field-border) !important;
    border-radius: var(--qt-field-radius);
    font-size: 14px;
    font-weight: var(--qt-checkout-input-weight);
    color: var(--qt-field-text);
    background: var(--qt-field-bg);
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}

.qt-checkout-billing input[type="text"],
.qt-checkout-billing input[type="email"],
.qt-checkout-billing input[type="tel"],
.qt-checkout-billing input[type="number"],
.qt-checkout-billing input[type="password"],
.qt-checkout-billing input[type="url"],
.qt-checkout-billing input.input-text,
.qt-checkout-billing select,
.qt-checkout-billing select.select,
.qt-checkout-billing .form-row input[type="text"],
.qt-checkout-billing .form-row input[type="email"],
.qt-checkout-billing .form-row input[type="tel"],
.qt-checkout-billing .form-row input[type="number"],
.qt-checkout-billing .form-row input[type="password"],
.qt-checkout-billing .form-row input[type="url"],
.qt-checkout-billing .form-row input.input-text,
.qt-checkout-billing .form-row select,
.qt-checkout-billing .woocommerce-input-wrapper input,
.qt-checkout-billing .woocommerce-input-wrapper select {
    height: var(--qt-field-height);
    max-height: var(--qt-field-height);
}

/* Checkout native selects: theme chevron-down icon */
.qt-checkout-billing select,
.qt-checkout-billing select.select,
.qt-checkout-billing .form-row select,
.qt-checkout-billing .woocommerce-input-wrapper select,
.qt-checkout-form .form-row select,
.qt-checkout-form .woocommerce-input-wrapper select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.24999 7.43933L12.25 14.4393L19.25 7.43933L20.3107 8.49999L12.25 16.5607L4.18933 8.49999L5.24999 7.43933Z' fill='%23334155'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: right 12px center;
    padding-right: 36px;
}
[dir="rtl"] .qt-checkout-billing select,
[dir="rtl"] .qt-checkout-billing select.select,
[dir="rtl"] .qt-checkout-billing .form-row select,
[dir="rtl"] .qt-checkout-billing .woocommerce-input-wrapper select,
[dir="rtl"] .qt-checkout-form .form-row select,
[dir="rtl"] .qt-checkout-form .woocommerce-input-wrapper select {
    background-position: left 12px center;
    padding-right: 12px;
    padding-left: 36px;
}

/* Native checkout selects: use the control's natural line metric so the
   selected text (incl. RTL/Arabic glyphs) stays vertically centred and is not
   clipped at the bottom of the fixed field height by the inherited body
   line-height (1.6). */
.qt-checkout-billing select,
.qt-checkout-billing select.select,
.qt-checkout-billing .form-row select,
.qt-checkout-billing .woocommerce-input-wrapper select,
.qt-checkout-form .form-row select,
.qt-checkout-form .woocommerce-input-wrapper select,
body.woocommerce-checkout form.checkout select:not(.select2-hidden-accessible) {
    line-height: normal;
}

body.woocommerce-checkout .woocommerce-form-coupon .input-text::placeholder,
body.woocommerce-checkout form.checkout_coupon .input-text::placeholder,
.qt-checkout-billing input::placeholder,
.qt-checkout-billing textarea::placeholder,
.qt-checkout-billing .form-row input::placeholder,
.qt-checkout-billing .form-row textarea::placeholder,
.qt-checkout-billing .woocommerce-input-wrapper input::placeholder,
.qt-checkout-billing .woocommerce-input-wrapper textarea::placeholder {
    color: var(--qt-placeholder);
    opacity: 1;
    font-weight: calc(var(--qt-checkout-input-weight) - 100);
}

.qt-checkout-billing textarea,
.qt-checkout-billing .form-row textarea,
.qt-checkout-billing .woocommerce-input-wrapper textarea,
.qt-checkout-form .form-row textarea,
.qt-checkout-form .woocommerce-input-wrapper textarea {
    min-height: 100px;
    height: auto;
    max-height: none;
    padding: 12px;
}

.qt-checkout-billing input:focus,
.qt-checkout-billing select:focus,
.qt-checkout-billing textarea:focus,
.qt-checkout-billing .form-row input:focus,
.qt-checkout-billing .form-row select:focus,
.qt-checkout-billing .form-row textarea:focus,
.qt-checkout-billing .woocommerce-input-wrapper input:focus,
.qt-checkout-billing .woocommerce-input-wrapper select:focus,
.qt-checkout-billing .woocommerce-input-wrapper textarea:focus {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
    outline: none;
}

.qt-checkout-billing label {
    display: block;
    margin-bottom: 6px;
    font-weight: 500;
    font-size: 13px;
    color: var(--qt-label-color);
}

.qt-checkout-billing .required {
    color: #ff4444;
}

/* Shipping / order notes / any other rows inside checkout form */
.qt-checkout-form .form-row input[type="text"],
.qt-checkout-form .form-row input[type="email"],
.qt-checkout-form .form-row input[type="tel"],
.qt-checkout-form .form-row input[type="number"],
.qt-checkout-form .form-row input[type="password"],
.qt-checkout-form .form-row input[type="url"],
.qt-checkout-form .form-row input.input-text,
.qt-checkout-form .form-row select,
.qt-checkout-form .form-row textarea,
.qt-checkout-form .woocommerce-input-wrapper input,
.qt-checkout-form .woocommerce-input-wrapper select,
.qt-checkout-form .woocommerce-input-wrapper textarea {
    min-height: var(--qt-field-height);
    padding: 8px 12px;
    border: var(--qt-field-border-w) solid var(--qt-field-border) !important;
    border-radius: var(--qt-field-radius);
    background: var(--qt-field-bg);
    color: var(--qt-field-text);
    font-size: 14px;
    font-weight: var(--qt-checkout-input-weight);
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}

.qt-checkout-form .form-row input[type="text"],
.qt-checkout-form .form-row input[type="email"],
.qt-checkout-form .form-row input[type="tel"],
.qt-checkout-form .form-row input[type="number"],
.qt-checkout-form .form-row input[type="password"],
.qt-checkout-form .form-row input[type="url"],
.qt-checkout-form .form-row input.input-text,
.qt-checkout-form .form-row select,
.qt-checkout-form .woocommerce-input-wrapper input,
.qt-checkout-form .woocommerce-input-wrapper select {
    height: var(--qt-field-height);
    max-height: var(--qt-field-height);
}
.qt-checkout-form .form-row input::placeholder,
.qt-checkout-form .woocommerce-input-wrapper input::placeholder,
.qt-checkout-form .form-row textarea::placeholder,
.qt-checkout-form .woocommerce-input-wrapper textarea::placeholder {
    color: var(--qt-placeholder);
    opacity: 1;
    font-weight: calc(var(--qt-checkout-input-weight) - 100);
}
.qt-checkout-form .form-row textarea,
.qt-checkout-form .woocommerce-input-wrapper textarea {
    min-height: 100px;
}
.qt-checkout-form .form-row input:focus,
.qt-checkout-form .form-row select:focus,
.qt-checkout-form .form-row textarea:focus,
.qt-checkout-form .woocommerce-input-wrapper input:focus,
.qt-checkout-form .woocommerce-input-wrapper select:focus,
.qt-checkout-form .woocommerce-input-wrapper textarea:focus {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
    outline: none;
}

.qt-checkout-form .form-row label {
    font-weight: 500;
    font-size: 13px;
    margin-bottom: 6px;
    color: var(--qt-label-color);
}

/* Select2 — match border-radius. Corner clipping is done by the inner
   .select2-selection--single (it has its own border-radius + overflow:hidden);
   the outer container must stay overflow:visible or it crops the selected
   text at the bottom of the fixed field height. */
body.woocommerce-checkout form.checkout .select2-container.select2-container--default {
    border-radius: var(--qt-field-radius);
    overflow: visible;
}

/* Select2 — fixed 47px total height to match text inputs */
.qt-checkout-billing .select2-container .select2-selection--single,
.qt-checkout-form .select2-container .select2-selection--single {
    height: var(--qt-field-height) !important;
    min-height: var(--qt-field-height) !important;
    max-height: var(--qt-field-height) !important;
    border: var(--qt-field-border-w) solid var(--qt-field-border) !important;
    border-radius: var(--qt-field-radius) !important;
    overflow: hidden;
    padding: 0 32px 0 12px;
    box-sizing: border-box;
    background: var(--qt-field-bg) !important;
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
    display: flex;
    align-items: center;
}
.qt-checkout-billing .select2-container--default .select2-selection--single .select2-selection__rendered,
.qt-checkout-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.25;
    color: var(--qt-field-text);
    padding: 0;
    margin: 0;
}
.qt-checkout-billing .select2-container--default .select2-selection--single .select2-selection__arrow,
.qt-checkout-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    min-height: var(--qt-field-height);
    top: 0;
    right: 8px;
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.qt-checkout-billing .select2-container--default .select2-selection--single .select2-selection__arrow b,
.qt-checkout-form .select2-container--default .select2-selection--single .select2-selection__arrow b {
    display: none !important;
}
.qt-checkout-billing .select2-container--default .select2-selection--single .select2-selection__arrow::before,
.qt-checkout-form .select2-container--default .select2-selection--single .select2-selection__arrow::before {
    content: "";
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.24999 7.43933L12.25 14.4393L19.25 7.43933L20.3107 8.49999L12.25 16.5607L4.18933 8.49999L5.24999 7.43933Z' fill='%23334155'/%3E%3C/svg%3E");
}

/* Global checkout Select2 fallback (state/city fields) */
body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    width: 24px;
    right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}
body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow b {
    display: none !important;
}
body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow::before {
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.24999 7.43933L12.25 14.4393L19.25 7.43933L20.3107 8.49999L12.25 16.5607L4.18933 8.49999L5.24999 7.43933Z' fill='%23334155'/%3E%3C/svg%3E") !important;
}

/* Native checkout selects fallback (when city/state is not enhanced by Select2).
   .qt-shipping-select has its own chevron styles above. */
body.woocommerce-checkout .qt-checkout-form select:not(.select2-hidden-accessible):not(.qt-shipping-select),
body.woocommerce-checkout form.checkout select:not(.select2-hidden-accessible):not(.qt-shipping-select) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.24999 7.43933L12.25 14.4393L19.25 7.43933L20.3107 8.49999L12.25 16.5607L4.18933 8.49999L5.24999 7.43933Z' fill='%23334155'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
    background-position: right 12px center !important;
    padding-right: 36px !important;
}
[dir="rtl"] body.woocommerce-checkout .qt-checkout-form select:not(.select2-hidden-accessible):not(.qt-shipping-select),
[dir="rtl"] body.woocommerce-checkout form.checkout select:not(.select2-hidden-accessible):not(.qt-shipping-select) {
    background-position: left 12px center !important;
    padding-right: 12px !important;
    padding-left: 36px !important;
}
[dir="rtl"] .qt-checkout-billing .select2-container--default .select2-selection--single .select2-selection__arrow,
[dir="rtl"] .qt-checkout-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    right: auto;
    left: 8px;
}
.qt-checkout-billing .select2-container--default.select2-container--focus .select2-selection--single,
.qt-checkout-billing .select2-container--default.select2-container--open .select2-selection--single,
.qt-checkout-form .select2-container--default.select2-container--focus .select2-selection--single,
.qt-checkout-form .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
}

/* Ship-to-different disabled via woocommerce_cart_needs_shipping_address */
.qt-checkout-shipping #ship-to-different-address,
.woocommerce-shipping-fields {
    display: none !important;
}

/* Core WC ship-to-different checkbox (#ship-to-different-address on h3) — one control only */
.qt-checkout-shipping #ship-to-different-address {
    margin: 8px 0 0;
    padding: 10px 12px;
    background: var(--qt-field-bg);
    border: var(--qt-field-border-w) solid var(--qt-field-border);
    border-radius: var(--qt-field-radius);
    box-shadow: none;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--qt-label-color);
}

.qt-checkout-shipping #ship-to-different-address label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    margin: 0;
    font-weight: 500;
    font-size: 13px;
    color: var(--qt-label-color);
}

.qt-checkout-shipping #ship-to-different-address input[type="checkbox"] {
    width: 16px;
    height: 16px;
    min-width: 16px;
    margin: 0;
    cursor: pointer;
    accent-color: var(--qt-checkout-accent, var(--primary-color));
}

/* Order notes live in .woocommerce-additional-fields (form-shipping.php); avoid duplicating fields */
.qt-checkout-shipping .woocommerce-additional-fields {
    margin-top: 16px;
}

.qt-checkout-shipping .woocommerce-additional-fields .form-row {
    margin-bottom: 0;
}

.qt-checkout-shipping .woocommerce-additional-fields h3 {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 12px;
    color: #1E293B;
}

.qt-checkout-review {
    flex: 1 1 40%;
    min-width: 300px;
}

.qt-order-review {
    background: var(--qt-field-bg);
    border: 1px solid #e5e7eb;
    border-radius: var(--qt-field-radius);
    box-shadow: none;
    padding: 20px;
    position: static;
    top: auto;
}

.qt-order-review table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 10px;
    border: 0 !important;
}

.qt-order-review table.shop_table {
    margin-right: 0;
}

.qt-order-review th,
.qt-order-review td {
    padding: 16px 0;
    text-align: start;
    border-bottom: 1px solid #eceff3;
    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    font-size: 13px;
    font-weight: 400;
}

.qt-order-review table th:last-child,
.qt-order-review table td:last-child {
    text-align: end;
}

.qt-order-review th {
    font-weight: 500;
    color: var(--qt-label-color);
}

.qt-order-review .product-name {
    font-weight: 500;
    font-size: 13px;
}

/* Checkout order review: same product card as cart drawer */
body.woocommerce-checkout #order_review thead {
    display: none;
}

body.woocommerce-checkout #order_review tbody tr.cart_item > td.product-name {
    padding: 0;
    border-bottom: 1px solid #e5e5e5;
    text-align: start !important;
}

body.woocommerce-checkout #order_review tbody tr.cart_item:last-child > td.product-name {
    border-bottom: 1px solid #eceff3;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item {
    padding: 16px 0;
    border-bottom: none;
    gap: 12px;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item-image {
    width: 64px;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item-name {
    font-size: 14px;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item-price {
    font-size: 14px;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item-price .woocommerce-Price-amount,
body.woocommerce-checkout #order_review .qt-mini-cart-item-price .amount {
    display: inline-block;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
    font-size: inherit !important;
    font-weight: inherit;
    color: inherit;
    text-align: start;
}

body.woocommerce-checkout #order_review .qt-mini-cart-item-actions {
    margin-top: 4px;
}

/* Summary prices: keep amount + currency on one line (match Total row) */
.qt-order-review .product-total .woocommerce-Price-amount,
.qt-order-review .product-total .amount,
.qt-order-review td .woocommerce-Price-amount,
.qt-order-review td .amount {
    display: inline-block;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: #333;
    text-align: end;
    text-transform: none;
}

.qt-order-review .woocommerce-Price-amount bdi {
    font-weight: 500;
    white-space: nowrap;
}

.qt-order-review .product-total {
    text-align: end;
    font-weight: 500;
}

.qt-order-review tfoot th {
    font-weight: 500;
    font-size: 14px;
}

.qt-order-review tfoot .order-total th,
.qt-order-review tfoot .order-total td {
    font-size: 15px;
    font-weight: 500;
    padding-top: 16px;
    padding-bottom: 16px;
    border-top: 1px solid #dfe4ea;
}

/* Keep checkout review paddings stable against Woo overrides */
body.woocommerce-checkout #order_review table.shop_table thead th.product-name {
    padding-left: 0;
    padding-right: 0;
}

body.woocommerce-checkout #order_review table.shop_table tbody td.product-name,
body.woocommerce-checkout #order_review table.shop_table tbody td.product-total {
    padding-top: 16px;
    padding-bottom: 16px;
    vertical-align: middle;
}

body.woocommerce-checkout #order_review table.shop_table tfoot th {
    padding-top: 16px;
    padding-bottom: 16px;
}

.qt-order-review tfoot .order-total .woocommerce-Price-amount,
.qt-order-review tfoot .order-total .amount {
    font-size: 15px;
    font-weight: 500;
}

/* Shipping summary row — same inline price treatment as Total */
.qt-order-review .woocommerce-shipping-totals.qt-shipping-totals--summary .woocommerce-Price-amount,
.qt-order-review .woocommerce-shipping-totals.qt-shipping-totals--summary .amount {
    font-size: 14px;
    font-weight: 400;
}

/* Keyframes shared with QuickFORM .qf-submit (qf-public.css) — duplicated so checkout matches even if qf-public is not enqueued */
@keyframes qt-qf-shake-every-5s {
    0%,
    90%,
    100% {
        transform: translateX(0);
    }
    92% {
        transform: translateX(-6px);
    }
    94% {
        transform: translateX(6px);
    }
    96% {
        transform: translateX(-4px);
    }
    98% {
        transform: translateX(4px);
    }
}

@keyframes qt-qf-shiny-slide {
    0% {
        transform: translateX(-120%);
        opacity: 0;
    }
    10%,
    90% {
        opacity: 1;
    }
    100% {
        transform: translateX(520%);
        opacity: 0;
    }
}

/* Place order — parity with QuickFORM .qf-submit */
#place_order {
    width: 100%;
    box-sizing: border-box;
    min-height: 50px;
    padding: 0 20px;
    border: none;
    border-radius: var(--qf-radius, var(--qt-field-radius, 6px)) !important;
    background: var(--qf-theme, var(--qt-checkout-accent, var(--primary-color))) !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: opacity 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden !important;
    isolation: isolate;
    margin-top: 10px;
    animation: 5s infinite qt-qf-shake-every-5s;
}

#place_order::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 80px !important;
    height: 100% !important;
    background: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 20%,
        rgba(255, 255, 255, 0.45) 50%,
        rgba(255, 255, 255, 0) 80%
    ) !important;
    transform: translateX(-120%);
    animation: 2.4s ease-in-out infinite qt-qf-shiny-slide !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

#place_order:hover {
    opacity: 0.9;
}

#place_order:focus {
    outline: none;
}

#place_order:focus-visible {
    outline: 2px solid var(--qf-theme, var(--qt-checkout-accent, var(--primary-color)));
    outline-offset: 3px;
}

#place_order:disabled,
#place_order[disabled] {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
    pointer-events: none;
    animation: none !important;
}

#place_order:disabled::before,
#place_order[disabled]::before {
    display: none !important;
}

/* Checkout login / register — same primary treatment as .qf-submit */
body.woocommerce-checkout .woocommerce-form-login .button,
body.woocommerce-checkout .woocommerce-form-login button[type="submit"],
body.woocommerce-checkout .woocommerce-form-register .button,
body.woocommerce-checkout .woocommerce-form-register button[type="submit"] {
    min-height: 48px;
    padding: 0 22px;
    border: none;
    border-radius: var(--qt-field-radius);
    background: var(--qt-checkout-accent, var(--primary-color));
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    font-family: inherit;
    box-shadow: var(--qt-field-shadow);
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.1s ease;
}

body.woocommerce-checkout .woocommerce-form-login .button:hover,
body.woocommerce-checkout .woocommerce-form-login button[type="submit"]:hover,
body.woocommerce-checkout .woocommerce-form-register .button:hover,
body.woocommerce-checkout .woocommerce-form-register button[type="submit"]:hover {
    opacity: 0.9;
}

body.woocommerce-checkout .woocommerce-form-login .button:focus,
body.woocommerce-checkout .woocommerce-form-login button[type="submit"]:focus,
body.woocommerce-checkout .woocommerce-form-register .button:focus,
body.woocommerce-checkout .woocommerce-form-register button[type="submit"]:focus {
    outline: none;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
}

/* ============================================
   WooCommerce My Account
   ============================================ */
body.woocommerce-account .woocommerce {
    max-width: 1388px;
    margin: 0 auto;
}

/* My Account uses shared page hero title; hide duplicate template/page title */
body.woocommerce-account h1.entry-title,
body.woocommerce-account .page-title {
    display: none;
}

body.woocommerce-account .woocommerce h2,
body.woocommerce-account .woocommerce h3,
body.woocommerce-account .woocommerce-MyAccount-content h2,
body.woocommerce-account .woocommerce-MyAccount-content h3 {
    font-size: 22px;
    font-weight: var(--font-weight-headings, 600);
    line-height: 1.25;
    color: var(--qt-field-text);
    margin: 0 0 14px;
}

body.woocommerce-account .woocommerce form.woocommerce-form-login,
body.woocommerce-account .woocommerce form.woocommerce-form-register,
body.woocommerce-account .woocommerce-EditAccountForm,
body.woocommerce-account .woocommerce-address-fields,
body.woocommerce-account .woocommerce-MyAccount-content form {
    background: var(--qt-field-bg, #fff);
    border: 1px solid #e5e7eb;
    border-radius: var(--theme-radius, var(--qt-field-radius, 8px));
    box-shadow: var(--qt-field-shadow);
    padding: 16px;
}

/* Guest auth: keep login/register boxes compact and centered */
body.woocommerce-account .qt-auth {
    max-width: 420px;
    width: 100%;
    margin: 0 auto 40px;
    box-sizing: border-box;
}

body.woocommerce-account .qt-auth__tabs {
    display: flex;
    gap: 0;
    margin: 0 0 20px;
    border: 1px solid #e5e7eb;
    border-radius: var(--theme-radius, var(--qt-field-radius, 8px));
    overflow: hidden;
    background: #f8fafc;
}

body.woocommerce-account .qt-auth__tab {
    flex: 1 1 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 600;
    color: #64748b;
    text-decoration: none;
    text-align: center;
    background: transparent;
    transition: color 0.15s ease, background 0.15s ease;
}

body.woocommerce-account .qt-auth__tab:hover {
    color: #0f172a;
    background: #fff;
}

body.woocommerce-account .qt-auth__tab.is-active {
    color: #fff;
    background: var(--primary-color);
}

body.woocommerce-account .qt-auth__title {
    max-width: none !important;
    margin: 0 0 14px !important;
    text-align: center;
}

body.woocommerce-account .qt-auth__hint {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.45;
    color: #64748b;
}

body.woocommerce-account .qt-auth__switch {
    margin: 16px 0 0;
    text-align: center;
    font-size: 14px;
    color: #64748b;
}

body.woocommerce-account .qt-auth__switch a {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

body.woocommerce-account .woocommerce form.woocommerce-form-login,
body.woocommerce-account .woocommerce form.woocommerce-form-register {
    max-width: none;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}

body.woocommerce-account .woocommerce-form-register .woocommerce-form-register__submit {
    width: 100%;
}

/* Keep “Se connecter” / “Register” above the box (same centered column) */
body.woocommerce-account .woocommerce > h2,
body.woocommerce-account #customer_login .u-column1 > h2,
body.woocommerce-account #customer_login .u-column2 > h2 {
    max-width: 420px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    box-sizing: border-box;
}

body.woocommerce-account .u-columns,
body.woocommerce-account .woocommerce .col2-set {
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
}

body.woocommerce-account .u-column1.col-1:only-child,
body.woocommerce-account .u-column1.col-1:only-of-type,
body.woocommerce-account #customer_login > .u-column1:only-child {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    width: 100%;
}

body.woocommerce-account .woocommerce form .form-row,
body.woocommerce-account .woocommerce-MyAccount-content form .form-row {
    margin: 0 0 12px;
}

/* Auth forms: tighter field stack (esp. password → remember me) */
body.woocommerce-account .qt-auth .form-row {
    margin: 0 0 10px;
    padding: 0;
}

body.woocommerce-account .qt-auth .form-row::before,
body.woocommerce-account .qt-auth .form-row::after {
    content: none;
    display: none;
}

body.woocommerce-account .qt-auth .woocommerce-form-row--wide {
    margin-bottom: 10px;
}

body.woocommerce-account .qt-auth .password-input {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 0;
}

body.woocommerce-account .qt-auth .show-password-input {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: 12px;
    transform: translateY(-50%);
    margin: 0;
}

body.woocommerce-account .woocommerce form label,
body.woocommerce-account .woocommerce-MyAccount-content form label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--qt-label-color, #334155);
}

body.woocommerce-account .woocommerce form input[type="text"],
body.woocommerce-account .woocommerce form input[type="email"],
body.woocommerce-account .woocommerce form input[type="tel"],
body.woocommerce-account .woocommerce form input[type="password"],
body.woocommerce-account .woocommerce form input.input-text,
body.woocommerce-account .woocommerce form select,
body.woocommerce-account .woocommerce form textarea,
body.woocommerce-account .woocommerce-MyAccount-content form input[type="text"],
body.woocommerce-account .woocommerce-MyAccount-content form input[type="email"],
body.woocommerce-account .woocommerce-MyAccount-content form input[type="tel"],
body.woocommerce-account .woocommerce-MyAccount-content form input[type="password"],
body.woocommerce-account .woocommerce-MyAccount-content form input.input-text,
body.woocommerce-account .woocommerce-MyAccount-content form select,
body.woocommerce-account .woocommerce-MyAccount-content form textarea {
    width: 100%;
    min-height: 46px;
    padding: 8px 12px;
    border: var(--qt-field-border-w, 1.5px) solid var(--qt-field-border, #E2E8F0) !important;
    border-radius: var(--qt-field-radius, 8px);
    background: var(--qt-field-bg, #fff);
    color: var(--qt-field-text, #1E293B);
    font-size: 14px;
    box-shadow: var(--qt-field-shadow);
}

body.woocommerce-account .woocommerce form input:focus,
body.woocommerce-account .woocommerce form select:focus,
body.woocommerce-account .woocommerce form textarea:focus,
body.woocommerce-account .woocommerce-MyAccount-content form input:focus,
body.woocommerce-account .woocommerce-MyAccount-content form select:focus,
body.woocommerce-account .woocommerce-MyAccount-content form textarea:focus {
    outline: none;
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 0.5px var(--primary-color), var(--qt-field-shadow);
}

body.woocommerce-account .woocommerce button.button,
body.woocommerce-account .woocommerce .button,
body.woocommerce-account .woocommerce input.button,
body.woocommerce-account .woocommerce a.button,
body.woocommerce-account .woocommerce-MyAccount-navigation a {
    cursor: pointer;
}

body.woocommerce-account .woocommerce button.button,
body.woocommerce-account .woocommerce .button,
body.woocommerce-account .woocommerce input.button,
body.woocommerce-account .woocommerce a.button {
    min-height: 44px;
    padding: 0 18px;
    border: none;
    border-radius: var(--qt-field-radius, 8px);
    background: var(--primary-color);
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
}

/* Remember me above the button (not beside it) */
body.woocommerce-account .woocommerce-form-login .form-row:has(.woocommerce-form-login__rememberme) {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 6px;
    margin-bottom: 10px;
}

body.woocommerce-account .woocommerce .woocommerce-form-login__rememberme {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    order: 1;
}

body.woocommerce-account .woocommerce-form-login .woocommerce-form-login__submit {
    order: 2;
    width: 100%;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: var(--qt-field-radius, 8px);
    overflow: hidden;
    background: #fff;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li + li {
    border-top: 1px solid #eceff3;
}

body.woocommerce-account .woocommerce-MyAccount-navigation a {
    display: block;
    padding: 12px 14px;
    color: #111827;
    text-decoration: none;
    font-weight: 500;
}

body.woocommerce-account .woocommerce-MyAccount-navigation .is-active a {
    background: var(--theme-color-surface, rgba(30, 30, 30, 0.1));
    color: #111827;
    font-weight: 600;
}

/* Payment container ("big box"): aligned bg + radius with theme tokens */
.woocommerce-checkout-payment,
body.woocommerce-checkout #payment {
    margin-top: 10px;
    border-top: none;
    padding-top: 0;
    padding: 12px;
    border-radius: var(--qt-field-radius);
    background: var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(30, 30, 30, 0.1))) !important;
}

.wc_payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 10px 0;
}

.wc_payment_method {
    margin: 0;
    border-bottom: none;
    padding: 4px 0;
}

.wc_payment_method label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    min-height: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    transition: color 0.1s ease;
}

.wc_payment_method input[type="radio"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.wc_payment_method label:hover {
    color: #111827;
}

.wc_payment_method input[type="radio"]:checked + label {
    color: #111827;
    font-weight: 600;
}

.wc_payment_method:has(input[type="radio"]:checked) label {
    color: #111827;
    font-weight: 600;
}

.payment_box {
    padding: 10px 12px;
    background: #f5f7fa;
    border-radius: 0;
    margin: 4px 0 8px;
    border: 0;
    box-shadow: none;
}

/* COD payment box + its pointers: same icon-surface tone, 10% darker */
body.woocommerce-checkout .payment_method_cod .payment_box {
    background: color-mix(
        in srgb,
        var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(30, 30, 30, 0.1))) 90%,
        #000 10%
    ) !important;
}

body.woocommerce-checkout .payment_method_cod .payment_box::before,
body.woocommerce-checkout .payment_method_cod .payment_box::after {
    display: none !important;
    content: none !important;
    background-color: color-mix(
        in srgb,
        var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(30, 30, 30, 0.1))) 90%,
        #000 10%
    ) !important;
    border-color: color-mix(
        in srgb,
        var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(30, 30, 30, 0.1))) 90%,
        #000 10%
    ) !important;
    color: color-mix(
        in srgb,
        var(--qt-checkout-accent-surface, var(--theme-color-surface, rgba(30, 30, 30, 0.1))) 90%,
        #000 10%
    ) !important;
}

/* Keep only divider before action button area */
body.woocommerce-checkout #order_review .place-order {
    border-top: 1px solid #eceff3;
    padding-top: 10px;
}

.payment_box input.input-text,
.payment_box input[type="text"],
.payment_box input[type="email"],
.payment_box input[type="tel"],
.payment_box select,
.payment_box textarea {
    min-height: var(--qt-field-height, 47px);
    border: var(--qt-field-border-w) solid var(--qt-field-border) !important;
    border-radius: var(--qt-field-radius);
    background: var(--qt-field-bg);
    box-shadow: var(--qt-field-shadow);
    font-size: 14px;
    color: var(--qt-field-text);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
}

.payment_box input.input-text,
.payment_box input[type="text"],
.payment_box input[type="email"],
.payment_box input[type="tel"],
.payment_box select {
    height: var(--qt-field-height, 47px);
    max-height: var(--qt-field-height, 47px);
}

.payment_box input:focus,
.payment_box select:focus,
.payment_box textarea:focus {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
    outline: none;
}

/* ============================================
   Thank You Page
   ============================================ */
.qt-thankyou-wrapper {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.qt-thankyou-success,
.qt-thankyou-failed {
    text-align: center;
    padding: 40px 20px;
}

.qt-thankyou-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
}

.qt-thankyou-icon--animated {
    width: 96px;
    height: 96px;
}

.qt-thankyou-icon--animated[hidden] {
    display: none;
}

.qt-thankyou-icon--animated svg {
    display: block;
    width: 100%;
    height: 100%;
}

.qt-thankyou-success .qt-thankyou-icon:not(.qt-thankyou-icon--animated) {
    color: #28a745;
}

.qt-thankyou-failed .qt-thankyou-icon {
    color: #ff4444;
}

.qt-thankyou-success h1,
.qt-thankyou-failed h1 {
    font-size: 32px;
    margin-bottom: 16px;
    color: #333;
}

.qt-thankyou-message {
    font-size: 18px;
    color: #666;
    margin-bottom: 32px;
}

.qt-order-overview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin: 32px 0;
    padding: 24px;
    background: #f8f8f8;
    border-radius: var(--theme-radius);
}

.qt-order-overview-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.qt-order-label {
    font-size: 14px;
    color: #666;
}

.qt-order-overview-item strong {
    font-size: 16px;
    color: #333;
}

.qt-order-details {
    margin-top: 32px;
}

.qt-order-details h2 {
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.qt-pay-button {
    display: inline-block;
    padding: 16px 40px;
    background: var(--primary-color);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-radius: var(--theme-radius-sm);
    transition: background 0.2s;
    margin-top: 20px;
}

.qt-pay-button:hover {
    background: var(--primary-color-hover);
}

.qt-order-actions {
    text-align: center;
    margin-top: 32px;
}

/* Checkout Responsive */
@media (max-width: 768px) {
    .qt-checkout-wrapper {
        flex-direction: column;
    }

    .qt-checkout-billing,
    .qt-checkout-review {
        flex: 1 1 100%;
        width: 100%;
        min-width: 0;
    }

    /* Summary first on mobile */
    .qt-checkout-review {
        order: -1;
    }

    .qt-order-review {
        position: static;
    }

    .qt-order-overview {
        grid-template-columns: 1fr;
    }

    .qt-thankyou-success h1,
    .qt-thankyou-failed h1 {
        font-size: 24px;
    }
}

/* ============================================
   Mini Cart Widget
   ============================================ */
.qt-mini-cart-items {
    max-height: 400px;
    overflow-y: auto;
    padding: 4px 0;
}

.qt-mini-cart-item {
    display: flex;
    gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e5e5;
    position: relative;
}

.qt-mini-cart-item:last-child {
    border-bottom: none;
}

.qt-mini-cart-item-image {
    width: 72px;
    aspect-ratio: 4 / 5;
    height: auto;
    flex-shrink: 0;
    border-radius: var(--theme-radius-sm);
    overflow: hidden;
    background: #f8f8f8;
}

.qt-mini-cart-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qt-mini-cart-item-details {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.qt-mini-cart-item-name {
    font-weight: 700;
    font-size: 15px;
    line-height: 1.35;
}

.qt-mini-cart-item-name a {
    color: #111;
    text-decoration: none;
    transition: color 0.2s;
}

.qt-mini-cart-item-name a:hover {
    color: var(--primary-color);
}

.qt-mini-cart-item-price {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--primary-color);
}

.qt-mini-cart-item-price .woocommerce-Price-amount {
    font-size: inherit !important;
    font-weight: inherit;
    color: inherit;
}

.qt-mini-cart-item-details .variation {
    margin: 0;
    font-size: 13px;
    color: #888;
    line-height: 1.35;
}

.qt-mini-cart-item-details .variation dt,
.qt-mini-cart-item-details .variation dd {
    display: inline;
    margin: 0;
    float: none;
}

.qt-mini-cart-item-details .variation dd {
    margin-inline-end: 0.35em;
}

.qt-mini-cart-item-details .variation dd p {
    display: inline;
    margin: 0;
}

.qt-mini-cart-item-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.qt-mini-cart-qty {
    direction: ltr;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-width: 96px;
    height: 30px;
    padding: 0 2px;
    border: 1px solid #d9d9d9;
    border-radius: 999px;
    background: #fff;
    box-sizing: border-box;
}

.qt-mini-cart-qty--locked {
    justify-content: center;
    min-width: 40px;
    padding: 0 10px;
}

.qt-mini-cart-qty__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: #222;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.qt-mini-cart-qty__btn:hover:not(:disabled) {
    background: #f3f3f3;
}

.qt-mini-cart-qty__btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.qt-mini-cart-qty__value {
    min-width: 1.5em;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: #111;
    font-variant-numeric: tabular-nums;
}

.qt-mini-cart-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 12px;
    border: 1px solid #d9d9d9;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.qt-mini-cart-remove:hover {
    background: #f5f5f5;
    border-color: #cfcfcf;
    color: #111;
}

.qt-mini-cart-item.is-updating {
    opacity: 0.55;
    pointer-events: none;
}

.qt-mini-cart-footer {
    padding: 16px;
    border-top: 1px solid #e5e5e5;
}

.qt-mini-cart-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 700;
}

.qt-mini-cart-total__label {
    color: #333;
}

.qt-mini-cart-total__amount {
    display: inline-flex;
    align-items: center;
}

.qt-mini-cart-total__amount .woocommerce-Price-amount {
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

/* Hide WC default "Subtotal:" if a stale fragment / plugin re-injects it */
.qt-mini-cart-total > strong {
    display: none !important;
}

.qt-mini-cart-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
}

.qt-mini-cart-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    text-align: center;
    font-weight: 500;
    border-radius: var(--theme-radius);
    transition: all 0.2s;
    text-decoration: none;
}

.qt-view-cart {
    background-color: transparent;
    color: #000;
    border: 1px solid #e5e5e5;
}

.qt-view-cart:hover {
    background: #e5e5e5;
}

/* Primary checkout CTA — keep button filled; arrow stays white */
.qt-mini-cart-buttons .qt-mini-cart-checkout,
.qt-mini-cart-buttons .qt-checkout,
.side-cart .qt-mini-cart-checkout,
.side-cart a.qt-checkout {
    background: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
    color: #fff !important;
    border: none !important;
}

.qt-mini-cart-buttons .qt-mini-cart-checkout:hover,
.qt-mini-cart-buttons .qt-checkout:hover,
.side-cart .qt-mini-cart-checkout:hover,
.side-cart a.qt-checkout:hover {
    background: var(--primary-color-hover) !important;
    background-color: var(--primary-color-hover) !important;
    color: #fff !important;
}

.qt-mini-cart-buttons .qt-mini-cart-checkout,
.qt-mini-cart-buttons .qt-checkout,
.side-cart .qt-mini-cart-checkout,
.side-cart a.qt-checkout {
    overflow: visible;
}

.qt-mini-cart-buttons .qt-mini-cart-checkout .qt-mini-cart-button__icon,
.qt-mini-cart-buttons .qt-checkout .qt-mini-cart-button__icon,
.side-cart .qt-mini-cart-checkout .qt-mini-cart-button__icon,
.side-cart a.qt-checkout .qt-mini-cart-button__icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
    line-height: 0;
    opacity: 1 !important;
    visibility: visible !important;
    color: #fff !important;
}

/* Dropdown chevron rotated −90° so it points forward (like an arrow) */
.qt-mini-cart-buttons .qt-mini-cart-checkout .qt-mini-cart-button__chevron,
.qt-mini-cart-buttons .qt-checkout .qt-mini-cart-button__chevron,
.side-cart .qt-mini-cart-checkout .qt-mini-cart-button__chevron,
.side-cart a.qt-checkout .qt-mini-cart-button__chevron {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    min-height: 18px;
    transform: rotate(-90deg);
    transform-origin: center center;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible;
}

.qt-mini-cart-buttons .qt-mini-cart-checkout .qt-mini-cart-button__chevron path,
.qt-mini-cart-buttons .qt-checkout .qt-mini-cart-button__chevron path,
.side-cart .qt-mini-cart-checkout .qt-mini-cart-button__chevron path,
.side-cart a.qt-checkout .qt-mini-cart-button__chevron path {
    stroke: currentColor !important;
    fill: currentColor !important;
}

[dir="rtl"] .qt-mini-cart-buttons .qt-mini-cart-checkout .qt-mini-cart-button__chevron,
[dir="rtl"] .qt-mini-cart-buttons .qt-checkout .qt-mini-cart-button__chevron,
[dir="rtl"] .side-cart .qt-mini-cart-checkout .qt-mini-cart-button__chevron,
[dir="rtl"] .side-cart a.qt-checkout .qt-mini-cart-button__chevron {
    transform: rotate(90deg);
}

.qt-mini-cart-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 0;
    padding: 32px 20px;
    text-align: center;
    color: #666;
}

.qt-mini-cart-empty .qt-empty-cart {
    max-width: none;
    margin: 0;
    padding: 0;
}

.qt-mini-cart-empty .qt-empty-cart-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 20px;
}

.qt-mini-cart-empty .qt-empty-cart-icon svg {
    width: 64px;
    height: 64px;
}

.qt-mini-cart-empty .qt-empty-cart-message {
    font-size: 16px;
    margin-bottom: 24px;
}

.qt-mini-cart-empty .qt-return-shop {
    padding: 0 28px;
    min-height: 44px;
    line-height: 44px;
    font-size: 15px;
}

/* Base shiny animation for sweep effect */
@keyframes shiny {
    0% {
        transform: translate(-150%, -50%) rotate(25deg);
    }

    100% {
        transform: translate(150%, -50%) rotate(25deg);
    }
}

.widget_shopping_cart_content {
    height: inherit;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Side cart price styling */
.qt-mini-cart-total .woocommerce-Price-amount bdi {
    font-size: inherit;
    font-weight: inherit;
}

/* Product Breadcrumb Wrapper - above gallery & product info */
.product-breadcrumb-wrapper {
    width: 100%;
    min-width: 0;
    margin-bottom: 20px;
}

/* Woodmart-style Breadcrumbs */
.product-summary-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 4px;
    font-size: 13px;
    color: #666;
    letter-spacing: 0.2px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    list-style: none;
    margin: 0;
    padding: 0;
}

.product-summary-breadcrumb > .breadcrumb-item {
    display: flex;
    align-items: center;
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    /* Ancestor crumbs keep their full width; only the current one truncates
       (see .breadcrumb-item--current). Without this the items compress and the
       labels collide with the separators on narrow screens. */
    flex-shrink: 0;
}

.product-summary-breadcrumb a {
    color: #666;
    text-decoration: none;
    transition: color 0.2s ease, border-bottom 0.2s ease;
    border-bottom: 1px solid transparent;
    flex-shrink: 0;
    white-space: nowrap;
}

.product-summary-breadcrumb a:hover {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.product-summary-breadcrumb .breadcrumb-separator {
    display: inline-flex;
    align-items: center;
    color: #bbb;
    flex-shrink: 0;
    line-height: 1;
    margin: 0;
    padding: 0;
    list-style: none;
}

.product-summary-breadcrumb .breadcrumb-separator svg {
    width: 14px;
    height: 14px;
    display: block;
    fill: none;
    overflow: visible;
}

.product-summary-breadcrumb .breadcrumb-separator svg path {
    fill: none;
    stroke: currentColor;
}

/* Match page-hero: flip only in RTL so the chevron follows reading direction. */
[dir="rtl"] .product-summary-breadcrumb .breadcrumb-separator svg {
    transform: scaleX(-1);
}

.product-summary-breadcrumb .breadcrumb-current {
    color: #333;
    font-weight: 500;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-summary-breadcrumb .breadcrumb-item--current {
    flex: 1 1 auto;
    min-width: 0;
}

/* RTL support */
[dir="rtl"] .product-summary-breadcrumb {
    flex-direction: row;
    justify-content: flex-start;
}

[dir="rtl"] .page-hero__sep svg {
    transform: scaleX(-1);
}

/* Hide page title on thank you page */
.woocommerce-order-received .entry-header,
.woocommerce-order-received .page-title,
.woocommerce-order-received h1.entry-title {
    display: none;
}


/* Hide payment instructions in order details */
.woocommerce-order-details .woocommerce-order-details__title+p,
.woocommerce-order-received .woocommerce-order-details p:first-of-type {
    display: none;
}

/* Center confirmation image on thank you page */
.qt-confirmation-image {
    display: block;
    margin: 20px auto 0;
}

/* Mobile: sticky bottom CTA sizing + clearance above mobile nav */
@media (max-width: 768px) {
    .product-sticky-bottom {
        padding: 10px 15px;
    }

    .sticky-bottom-cta {
        font-size: 16px;
        padding: 12px 20px;
    }

    /* Sit above fixed mobile bottom bar */
    body.quicktheme-mobile-bottom-nav .product-sticky-bottom.visible {
        bottom: calc(var(--quicktheme-mobile-bar-height, 56px) + env(safe-area-inset-bottom, 0px));
    }
}

/* ── Mobile bottom navigation bar (reference: 4 tabs, icons + caps labels) ── */
.mobile-bottom-bar {
    display: none;
}

@media (max-width: 768px) {
    body.quicktheme-mobile-bottom-nav {
        padding-bottom: calc(var(--quicktheme-mobile-bar-height, 56px) + env(safe-area-inset-bottom, 0px));
    }

    .mobile-bottom-bar {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9990;
        justify-content: space-around;
        align-items: stretch;
        gap: 0;
        min-height: var(--quicktheme-mobile-bar-height, 56px);
        padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
        margin: 0;
        background: #fff;
        border-top: none;
        /* Same token as QuickFORM fields (--qf-shadow), flipped on Y for a top edge lift */
        box-shadow: -2px -5px 12.9px -9px rgba(157, 157, 157, 0.81);
        box-sizing: border-box;
    }

    .mobile-bottom-bar__item {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        min-width: 0;
        padding: 6px 2px;
        margin: 0;
        background: none;
        border: none;
        font: inherit;
        text-decoration: none;
        color: #6b7280;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .mobile-bottom-bar__item:hover,
    .mobile-bottom-bar__item:focus-visible {
        color: var(--primary-color);
    }

    .mobile-bottom-bar__icon {
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 0;
        color: var(--primary-color);
        position: relative;
    }

    .mobile-bottom-bar__icon .cart-count {
        top: -6px;
        right: -8px;
        min-width: 16px;
        height: 16px;
        font-size: 10px;
    }

    .mobile-bottom-bar--labels-hidden .mobile-bottom-bar__label {
        display: none;
    }

    .mobile-bottom-bar--labels-hidden .mobile-bottom-bar__item {
        gap: 0;
    }

    .mobile-bottom-bar__item:hover .mobile-bottom-bar__icon,
    .mobile-bottom-bar__item:focus-visible .mobile-bottom-bar__icon {
        color: var(--primary-color-hover, var(--primary-color));
    }

    .mobile-bottom-bar__icon svg {
        display: block;
        width: 24px;
        height: 24px;
        flex-shrink: 0;
        fill: none;
        overflow: visible;
    }

    /* Hugeicons default stroke in assets is often 1–2; lock to 1.5px for bottom bar */
    .mobile-bottom-bar__icon svg :where(path, line, circle, ellipse, polyline, polygon, rect) {
        stroke: currentColor;
        stroke-width: 1.5;
    }

    .mobile-bottom-bar__label {
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0px;
        line-height: 1.2;
        text-align: center;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* Load more: hide numbered pages when JS active (crawl/screen readers: nav unhidden in HTML) */
body.quicktheme-shop-load-more .shop-page-wrapper .shop-pagination-nav[hidden] {
    display: none;
}

.shop-load-more-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 32px auto 16px;
    max-width: 1388px;
    padding: 0 20px;
}

.shop-load-more-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 28px;
    background: var(--primary-color, #0d9488);
    color: #fff;
    border: none;
    border-radius: var(--theme-radius, 8px);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, opacity 0.2s;
}

.shop-load-more-btn:hover:not(:disabled) {
    background: var(--primary-color-hover, #0f766e);
}

.shop-load-more-btn:disabled {
    opacity: 0.65;
    cursor: wait;
}

.shop-load-more-wrap.is-loading .shop-load-more-spinner {
    width: 24px;
    height: 24px;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--primary-color, #0d9488);
    border-radius: 50%;
    animation: quickthemeSpin 0.7s linear infinite;
}

@keyframes quickthemeSpin {
    to {
        transform: rotate(360deg);
    }
}

.woocommerce nav.woocommerce-pagination ul {
    border: none;
    margin-top: 32px;
    display: flex;
    justify-content: center;
}

.woocommerce nav.woocommerce-pagination ul li {
    border: none !important;
}

/* ============================================
   CSS-Only Product Entrance Animations (Shopify-style)
   ============================================ */

/* Keyframe animation */
@keyframes productFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Product grid items — animate home / related / upsell only. Main shop & category
 * grids use .products-grid on ul.products: do NOT start those at opacity:0 (IntersectionObserver
 * can miss above-the-fold items → blank shop). */
.latest-products-grid li,
.related-products-grid li {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Animated state - applied by JS.
 * Use transform:none (not translateY(0)) so the li doesn’t keep a transform
 * containing block that can break descendant hover leave transitions. */
.latest-products-grid li.animate-in,
.related-products-grid li.animate-in {
    opacity: 1;
    transform: none;
}

/* Single product page sections - initial hidden state */
.single-product-wrapper .product-intro,
.single-product-wrapper .product-summary,
.single-product-wrapper .product-tabs-section,
.single-product-wrapper .related-products-section {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Gallery: opacity only — transform breaks position:sticky */
.single-product-wrapper .product-images {
    opacity: 0;
    transition: opacity 0.6s ease-out;
}

/* Animated state - applied by JS */
.single-product-wrapper .product-images.animate-in {
    opacity: 1;
}

.single-product-wrapper .product-intro.animate-in,
.single-product-wrapper .product-summary.animate-in,
.single-product-wrapper .product-tabs-section.animate-in,
.single-product-wrapper .related-products-section.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* Checkout form - initial hidden state */
.single-product-wrapper .acc-checkout-box {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Checkout form - animated state */
.single-product-wrapper .acc-checkout-box.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* ============================================
   Product Tabs & Reviews
   ============================================ */
.product-tabs-section {
    max-width: 1388px;
    margin: 20px auto;
    padding: 64px 0 0;
    clear: both;
    width: 100%;
}

/* Card shell: tab strip + content (radius follows Customizer --theme-radius scale) */
.product-tabs-section .woocommerce-tabs.wc-tabs-wrapper {
    width: 100%;
    border: 1px solid #ececec;
    border-radius: var(--theme-radius-lg, 12px);
    background: #fff;
    box-shadow: none;
    overflow: hidden;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    border: none;
    background: #fff;
    border-bottom: 1px solid #ececec;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li {
    position: relative;
    flex: 0 0 auto;
    min-width: 150px;
    margin: 0;
    padding: 0;
    cursor: pointer;
    list-style: none;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a {
    display: block;
    width: 100%;
    min-height: 54px;
    padding: 16px 22px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: #444;
    text-align: center;
    text-decoration: none;
    border-radius: 0;
    border: none;
    transition: color 0.2s ease;
    cursor: pointer;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a:hover {
    color: #111;
    background: transparent;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li.active a {
    color: var(--primary-color, #1e1e1e);
    font-weight: 700;
    background: #fff;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a:focus {
    outline: none;
}

.product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a:focus-visible {
    outline: 2px solid var(--primary-color, #17a2b8);
    outline-offset: 2px;
}

/* Active tab underline — matches Customizer primary */
.product-tabs-section .woocommerce-tabs .tabs li.active::after {
    content: '';
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: -1px;
    height: 2px;
    background: var(--primary-color, #1e1e1e);
    display: block;
}

.woocommerce-Tabs-panel {
    display: none;
    margin: 0;
    padding: 28px 22px 30px;
    animation: fadeIn 0.35s ease;
    font-size: 14px;
    line-height: 1.7;
    color: #333;
}

.woocommerce-Tabs-panel:target,
.woocommerce-Tabs-panel[style*="block"] {
    display: block !important;
}

#tab-reviews {
    color: #333;
}

/* ── Mobile: product tabs as accordion (JS adds .qt-accordion-mode) ── */
.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode {
    padding: 0;
    border-radius: var(--theme-radius-lg, 12px);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion {
    width: 100%;
    margin: 0;
    padding: 0;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item {
    padding-left: 12px;
    padding-right: 12px;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-trigger {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    margin: 0;
    padding: 14px 0;
    border: 0;
    border-bottom: 1px solid #ececec;
    text-align: start;
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.3;
    color: #111;
    background: #fff;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.15s ease, color 0.15s ease;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item.is-open .qt-accordion-trigger {
    color: var(--primary-color, #1e1e1e);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item:last-of-type .qt-accordion-trigger {
    border-bottom: none;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-trigger:hover,
.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-trigger:focus-visible {
    background: color-mix(in srgb, var(--font-body, #333) 4%, #fff);
    outline: none;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-trigger:focus-visible {
    box-shadow: inset 0 0 0 2px var(--primary-color, #17a2b8);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-title {
    flex: 1 1 auto;
    min-width: 0;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 300;
    color: #555;
    transition: color 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-icon::before {
    content: '\002B';
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item.is-open .qt-accordion-icon {
    color: var(--primary-color, #1e1e1e);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item.is-open .qt-accordion-icon::before {
    content: '\2212';
    font-size: 1.1rem;
    font-weight: 400;
}

/* Smooth expand/collapse — same timing curve as side drawers */
.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 480ms cubic-bezier(0.4, 0.05, 0.35, 1);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item.is-open .qt-accordion-panel {
    grid-template-rows: 1fr;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-panel__inner {
    overflow: hidden;
    min-height: 0;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .woocommerce-Tabs-panel {
    display: block !important;
    margin: 0;
    padding: 12px;
    border: none;
    animation: none;
    font-size: 0.9375rem;
    line-height: 1.65;
    color: #333;
    box-shadow: none;
    background: #fafafa;
    opacity: 0;
    transition: opacity 320ms cubic-bezier(0.4, 0.05, 0.35, 1);
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-item.is-open .woocommerce-Tabs-panel {
    opacity: 1;
    transition-delay: 80ms;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode #tab-description {
    font-size: 14px;
    background: unset;
}

.woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode #tab-reviews {
    padding: 0;
    background-color: rgba(250, 250, 250, 0);
}

@media (prefers-reduced-motion: reduce) {
    .woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-panel,
    .woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .woocommerce-Tabs-panel,
    .woocommerce-tabs.wc-tabs-wrapper.qt-accordion-mode .qt-accordion-icon {
        transition: none;
    }
}

/* Shipping tab — clean rows */
.product-shipping-info {
    margin: 0;
}

.product-shipping-info ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.product-shipping-info li {
    margin: 0;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--primary-color, #17a2b8) 6%, #fff);
    border: 1px solid color-mix(in srgb, var(--primary-color, #17a2b8) 14%, transparent);
    border-radius: var(--theme-radius, 8px);
    line-height: 1.55;
}

.product-shipping-info li strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #555;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hide redundant titles at the beginning of tab panels */
.woocommerce-Tabs-panel>h2:first-child,
.woocommerce-Tabs-panel>h3:first-child,
.woocommerce-Tabs-panel .product-shipping-info h3,
.woocommerce-Tabs-panel #comments>h2.woocommerce-Reviews-title {
    display: none !important;
}

/* ——— Customer Reviews (product tab) ——— */
:root {
    --qt-reviews-cta-bg: var(--primary-color, #17a2b8);
    --qt-reviews-cta-hover: var(--primary-color-hover, #138496);
    --qt-reviews-muted: #757575;
    --qt-reviews-divider: #e0e0e0;
    --qt-reviews-star: #eab308;
    --qt-reviews-card-star: #eab308;
    --qt-reviews-card-star-empty: #e0e0e0;
}

#reviews.woocommerce-Reviews {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.qt-reviews-header {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 24px;
    margin-bottom: 0;
    flex-wrap: wrap;
}

.qt-reviews-header__main {
    /* auto basis — 240px basis becomes HEIGHT when mobile sets flex-direction:column */
    flex: 1 1 auto;
    min-width: 0;
}

.qt-reviews-header__title {
    margin: 0 0 12px;
    font-size: 1.25rem;
    font-weight: 500;
    color: #000;
    letter-spacing: -0.02em;
}

.qt-reviews-header__stats {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.qt-reviews-header__score {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
    color: #000;
    letter-spacing: -0.03em;
}

.qt-reviews-header__count {
    font-size: 0.9375rem;
    font-weight: 400;
    color: var(--qt-reviews-muted);
}

.qt-reviews-write-wrap {
    display: flex;
    justify-content: flex-start;
    margin: 0 0 16px;
}

.qt-reviews-write-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    border-radius: var(--theme-radius, 8px);
    background: var(--qt-reviews-cta-bg);
    color: #fff !important;
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: none !important;
    border: none;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease, filter 0.2s ease;
}

.qt-reviews-write-btn:hover,
.qt-reviews-write-btn:focus-visible {
    background: var(--qt-reviews-cta-hover);
    color: #fff !important;
}

.qt-reviews-write-btn[aria-expanded="true"] {
    background: color-mix(in srgb, var(--qt-reviews-cta-bg) 88%, #000);
}

/* Smooth collapsible review form */
.qt-reviews-form-panel {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 0.35s ease;
}

.qt-reviews-form-panel.is-collapsed {
    grid-template-rows: 0fr;
}

.qt-reviews-form-panel__inner {
    min-height: 0;
    overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .qt-reviews-form-panel {
        transition: none;
    }
}

.qt-reviews-divider {
    border: none;
    border-top: 1px solid var(--qt-reviews-divider);
    margin: 20px 0;
}

/* Reviews list: FIGS-style cards (stars + date, body, author bottom) */
#reviews #comments ol.commentlist,
.commentlist {
    padding: 0;
    margin: 0 0 20px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

#reviews #comments ol.commentlist > li,
.commentlist > li {
    margin: 0;
    list-style: none;
    width: 100%;
    max-width: 100%;
    border: 0;
    background: transparent;
    padding: 0;
}

.commentlist .children {
    display: none;
}

/* Single card surface — kill WC dual box (.comment_container + .comment-text + avatar offset) */
#reviews #comments ol.commentlist li .comment_container.qt-review-item,
.qt-review-item,
.comment_container.qt-review-item {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 22px 22px 20px;
    border: 1px solid #e8e8e8;
    border-radius: var(--theme-radius, 8px);
    background: #fff;
    box-sizing: border-box;
}

#reviews #comments ol.commentlist li .comment-text,
#reviews #comments ol.commentlist li .comment-text.qt-review,
.qt-review,
.comment-text.qt-review {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
    box-sizing: border-box;
}

.qt-review__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 14px;
}

.qt-review__stars {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 1;
}

.qt-review__stars .qt-rating-stars,
.qt-review__stars .star-rating,
.qt-review__stars .product-card-stars {
    margin: 0;
}

.qt-review__stars .product-card-star--full path,
.qt-review__stars .product-card-star-fg path {
    fill: var(--qt-reviews-card-star, #eab308);
}

.qt-review__stars .product-card-star--empty path,
.qt-review__stars .product-card-star-bg path {
    fill: var(--qt-reviews-card-star-empty, #e0e0e0);
}

.qt-review__stars .qt-rating-stars svg,
.qt-review__stars .star-rating span::before {
    color: var(--qt-reviews-card-star, #eab308);
}

.qt-review__date {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.3;
    color: #8a8a8a;
    white-space: nowrap;
    flex-shrink: 0;
}

.qt-review__awaiting {
    margin: 0 0 12px;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: #9a9a9a;
}

.qt-review__awaiting em {
    font-style: italic;
}

.qt-review__body {
    flex: 1 1 auto;
    margin: 0 0 18px;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.65;
    color: #222;
}

.qt-review__body.description,
.comment-text .description.qt-review__body {
    padding-top: 0;
}

.qt-review__body p,
.comment-text .description p {
    margin: 0 0 0.75em;
}

.qt-review__body p:last-child,
.comment-text .description p:last-child {
    margin-bottom: 0;
}

.qt-review__author {
    margin: auto 0 0;
    padding-top: 4px;
    font-size: 0.875rem;
    line-height: 1.35;
    color: #111;
}

.qt-review__author-name {
    font-weight: 700;
}

.qt-review__verified {
    display: inline-block;
    margin-inline-start: 0.4em;
    font-style: italic;
    font-weight: 400;
    font-size: 0.8125rem;
    color: #888;
}

.qt-review__product {
    display: block;
    margin-top: 8px;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.35;
    color: #757575;
    text-decoration: none;
    transition: color 0.15s ease;
}

.qt-review__product:hover,
.qt-review__product:focus-visible {
    color: var(--primary-color, #0d9488);
}

/* ——— All Reviews page ——— */
.qt-all-reviews {
    padding-bottom: 64px;
}

.qt-all-reviews .page-hero {
    margin-bottom: 28px;
}

.qt-all-reviews__empty {
    margin: 24px 0 0;
    font-size: 0.9375rem;
    color: #757575;
}

/* Desktop 4-col grid (overrides product-tab .commentlist column layout) */
.qt-all-reviews ol.qt-reviews-grid.commentlist,
ol.qt-reviews-grid.commentlist {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    width: 100%;
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
}

.qt-all-reviews .qt-reviews-grid > li,
ol.qt-reviews-grid > li {
    margin: 0;
    min-width: 0;
    height: 100%;
}

.qt-all-reviews .qt-review-item,
.qt-all-reviews .comment_container.qt-review-item {
    height: 100%;
}

.qt-all-reviews .qt-reviews-load-more-wrap {
    margin-top: 40px;
}

@media (max-width: 1100px) {
    .qt-all-reviews ol.qt-reviews-grid.commentlist,
    ol.qt-reviews-grid.commentlist {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (max-width: 800px) {
    .qt-all-reviews ol.qt-reviews-grid.commentlist,
    ol.qt-reviews-grid.commentlist {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .qt-all-reviews {
        padding-bottom: 48px;
    }
}

@media (max-width: 520px) {
    .qt-all-reviews ol.qt-reviews-grid.commentlist,
    ol.qt-reviews-grid.commentlist {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* Hide legacy WC avatar / meta leftovers if plugins re-inject them */
.qt-review-item .avatar,
.qt-review-item .comment-meta,
.qt-review-item .woocommerce-review__author,
.qt-review-item .woocommerce-review__published-date,
.qt-review-item .woocommerce-review__dash {
    display: none !important;
}

@media (max-width: 600px) {
    #reviews #comments ol.commentlist,
    .commentlist {
        gap: 12px;
        margin-bottom: 16px;
    }

    #reviews #comments ol.commentlist li .comment_container.qt-review-item,
    .qt-review-item,
    .comment_container.qt-review-item {
        padding: 18px 16px 16px;
    }

    /* Mobile: reviews slider with side arrows */
    .qt-reviews-slider-wrap {
        position: relative;
        margin-bottom: 16px;
        padding-inline: 0;
    }

    .qt-reviews-slider-btn {
        display: none;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 20;
        width: 34px;
        height: 34px;
        padding: 0;
        margin: 0;
        border: 1.5px solid var(--qt-reviews-divider, #e0e0e0);
        border-radius: 50%;
        background: #fff;
        color: #1a1a1a;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: box-shadow 0.15s ease, opacity 0.15s ease;
    }

    .qt-reviews-slider-wrap--ready .qt-reviews-slider-btn {
        display: inline-flex;
    }

    .qt-reviews-slider-btn:hover:not(:disabled) {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
    }

    .qt-reviews-slider-btn:disabled {
        opacity: 0.35;
        cursor: default;
        pointer-events: none;
    }

    .qt-reviews-slider-btn--prev {
        inset-inline-start: 8px;
    }

    .qt-reviews-slider-btn--next {
        inset-inline-end: 8px;
    }

    [dir="rtl"] .qt-reviews-slider-btn svg {
        transform: scaleX(-1);
    }

    #reviews #comments ol.commentlist.qt-reviews-slider {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 0;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding-bottom: 4px;
        margin-bottom: 0;
    }

    #reviews #comments ol.commentlist.qt-reviews-slider::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    #reviews #comments ol.commentlist.qt-reviews-slider > li,
    #reviews #comments .qt-reviews-slider-wrap--ready ol.commentlist.qt-reviews-slider > li {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    #reviews #comments ol.commentlist.qt-reviews-slider li .comment_container.qt-review-item,
    #reviews #comments ol.commentlist.qt-reviews-slider .qt-review-item {
        height: 100%;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .qt-reviews-write-wrap {
        margin-bottom: 12px;
    }

    .qt-reviews-write-btn {
        width: 100%;
    }
}

/* Desktop / tablet: hide review slider chrome (stack vertically) */
.qt-reviews-slider-wrap {
    position: relative;
}

.qt-reviews-slider-btn {
    display: none;
}

@media (min-width: 601px) {
    .qt-reviews-slider-wrap {
        padding-inline: 0;
    }
}


.comment-text .description p:last-child {
    margin-bottom: 0;
}

/* Review images (HTML in comment body) */
.comment-text .description img {
    display: inline-block;
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: var(--theme-radius);
    margin: 12px 8px 0 0;
    vertical-align: top;
}

.star-rating {
    float: none;
    overflow: hidden;
    position: relative;
    height: 1em;
    line-height: 1;
    font-size: 1.125rem;
    width: 5.4em;
    font-family: 'star';
    color: var(--qt-reviews-star) !important;
    margin: 0;
}

.star-rating::before {
    content: '\73\73\73\73\73';
    color: #e5e5e5;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
}

.star-rating span {
    overflow: hidden;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
    padding-top: 1.5em;
}

.star-rating span::before {
    content: '\53\53\53\53\53';
    color: var(--qt-reviews-star) !important;
    top: 0;
    left: 0;
    position: absolute;
}

/* Review list stars */
#reviews .commentlist .qt-review__stars .star-rating {
    font-size: 0.875rem;
    margin: 0;
}

#reviews .commentlist .qt-review__stars .star-rating::before {
    color: var(--qt-reviews-card-star-empty, #e0e0e0) !important;
}

#reviews .commentlist .qt-review__stars .star-rating span::before {
    color: var(--qt-reviews-card-star, #eab308) !important;
}

#reviews .woocommerce-pagination {
    margin: 8px 0 32px;
}

#reviews .woocommerce-pagination ul {
    display: flex;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}

#reviews .woocommerce-pagination a,
#reviews .woocommerce-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    padding: 6px 10px;
    border-radius: var(--theme-radius-sm);
    border: 1px solid var(--qt-reviews-divider);
    text-decoration: none;
    color: #333;
    cursor: pointer;
}

#reviews .woocommerce-pagination span.current {
    background: #f5f5f5;
    font-weight: 600;
}

/* Review Form Styling */
#review_form_wrapper {
    background: rgba(255, 255, 255, 0);
    padding: 0;
    border-radius: var(--theme-radius-lg, 12px);
    border: 1px solid color-mix(in srgb, var(--font-body, #333) 10%, transparent);
    margin-top: 4px;
    scroll-margin-top: 24px;
    box-shadow: none;
    overflow: visible;
    box-sizing: content-box;
}

#review_form {
    padding: 20px;
    border-radius: 0;
    box-sizing: border-box;
}

#review_form .comment-reply-title {
    display: block;
    margin: 0 0 20px;
    padding: 0 0 16px;
    font-size: 1.125rem;
    font-weight: var(--font-weight-headings, 600);
    line-height: 1.35;
    color: #1a1a1a;
    border-bottom: 1px solid var(--qt-reviews-divider);
}

#review_form .form-submit {
    margin-top: 16px;
}

/* WooCommerce injects a second star row (p.stars) before #rating; we use Hugeicons only */
#review_form .qt-review-rating-field p.stars {
    display: none !important;
}

#review_form .form-submit input[type="submit"],
#review_form .form-submit input#submit,
#review_form .form-submit input.submit,
#review_form input[type="submit"]#submit,
#review_form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    border-radius: var(--theme-radius, 8px);
    padding: 12px 32px;
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: 1.2;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    background: var(--qt-reviews-cta-bg) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    transition:
        background 0.2s ease,
        filter 0.2s ease,
        transform 0.12s ease,
        box-shadow 0.2s ease;
    cursor: pointer;
}

#review_form .form-submit input[type="submit"]:hover,
#review_form .form-submit input#submit:hover,
#review_form .form-submit input.submit:hover,
#review_form input[type="submit"]#submit:hover,
#review_form button[type="submit"]:hover {
    background: var(--qt-reviews-cta-hover) !important;
    color: #fff !important;
    filter: brightness(0.98);
    box-shadow: 0 2px 8px color-mix(in srgb, var(--primary-color, #17a2b8) 28%, transparent);
    transform: translateY(-1px);
}

#review_form .form-submit input[type="submit"]:active,
#review_form .form-submit input#submit:active,
#review_form input[type="submit"]#submit:active,
#review_form button[type="submit"]:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

#review_form .form-submit input[type="submit"]:focus-visible,
#review_form .form-submit input#submit:focus-visible,
#review_form input[type="submit"]#submit:focus-visible,
#review_form button[type="submit"]:focus-visible {
    outline: 2px solid var(--primary-color, #17a2b8);
    outline-offset: 2px;
}

/* Native select kept for WC; visually hidden */
.qt-rating-native-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

.qt-review-rating-field {
    position: relative;
    margin-bottom: 20px;
}

.qt-review-rating-label {
    margin: 0 0 10px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
    letter-spacing: 0.01em;
}

.qt-review-stars-input {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2px;
    flex-wrap: wrap;
}

.qt-review-star-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    margin: 0;
    padding: 2px 3px;
    background: none;
    border: none;
    /* Empty / hover: cool gray; filled uses gold via .is-active */
    color: #d6d3d1;
    line-height: 0;
    border-radius: var(--theme-radius-sm, 4px);
    transition:
        color 0.15s ease,
        transform 0.1s ease,
        background 0.15s ease;
    cursor: pointer;
}

.qt-review-star-btn svg {
    display: block;
    width: 20px;
    height: 20px;
}

/* SVGs use hardcoded fill; tie to button color for empty vs active */
.qt-review-star-btn svg,
.qt-review-star-btn svg path {
    fill: currentColor;
}

/* Hover/focus preview: fill this star and all before it */
.qt-review-stars-input:has(.qt-review-star-btn:hover) .qt-review-star-btn,
.qt-review-stars-input:has(.qt-review-star-btn:focus-visible) .qt-review-star-btn {
    color: #fcd34d;
}

.qt-review-stars-input:has(.qt-review-star-btn:hover) .qt-review-star-btn:hover ~ .qt-review-star-btn,
.qt-review-stars-input:has(.qt-review-star-btn:focus-visible) .qt-review-star-btn:focus-visible ~ .qt-review-star-btn {
    color: #d6d3d1;
}

.qt-review-star-btn:hover,
.qt-review-star-btn:focus-visible {
    transform: scale(1.04);
    outline: none;
}

.qt-review-star-btn:focus-visible {
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--primary-color, #17a2b8);
}

.qt-review-star-btn.is-active {
    color: #eab308;
}

.comment-form-comment {
    margin-bottom: 0;
}

.comment-form-comment label {
    display: block;
    margin: 0 0 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.comment-form-comment textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 14px 16px;
    border: 1px solid #e0e0e0;
    border-radius: var(--theme-radius, 8px);
    min-height: 140px;
    font-size: 0.9375rem;
    line-height: 1.55;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    resize: vertical;
    background: #fafafa;
}

.comment-form-comment textarea:hover {
    border-color: #ccc;
}

.comment-form-comment textarea:focus {
    outline: none;
    border-color: var(--primary-color, #17a2b8);
    background: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, #17a2b8) 18%, transparent);
}

#review_form .comment-form-author,
#review_form .comment-form-email {
    margin-bottom: 16px;
}

#review_form .comment-form-author label,
#review_form .comment-form-email label {
    display: block;
    margin: 0 0 6px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

#review_form .comment-form-author input,
#review_form .comment-form-email input {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 10px 14px;
    border: 1px solid #e0e0e0;
    border-radius: var(--theme-radius, 8px);
    font-size: 0.9375rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#review_form .comment-form-author input:focus,
#review_form .comment-form-email input:focus {
    outline: none;
    border-color: var(--primary-color, #17a2b8);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, #17a2b8) 18%, transparent);
}

.submit-review-btn {
    margin-top: 20px;
}

.woocommerce-noreviews {
    margin: 0 0 24px;
    color: var(--qt-reviews-muted);
    font-size: 0.9375rem;
}

@media (max-width: 600px) {
    .qt-reviews-header {
        flex-direction: column;
        align-items: stretch;
    }

    .qt-reviews-header__main {
        flex: 0 0 auto;
        width: 100%;
    }

    .qt-reviews-header__score {
        font-size: 1.75rem;
    }

    #review_form {
        padding: 16px;
        border-radius: 0;
    }

    #review_form .form-submit input[type="submit"],
    #review_form .form-submit input#submit,
    #review_form .form-submit input.submit,
    #review_form .form-submit button[type="submit"] {
        width: 100%;
    }
}

/* Shipping Tab Content */
.product-shipping-info ul {
    list-style: none;
    padding: 0;
}

.product-shipping-info li {
    margin-bottom: 12px;
    display: flex;
    gap: 10px;
}

.product-shipping-info li strong {
    min-width: 120px;
    color: var(--primary-color);
}

/* ============================================
   Footer Styling
   ============================================ */
.footer-top {
    padding: 0;
}

/* Response for Tabs and Footer */
@media (max-width: 768px) {
    .product-tabs-section {
        padding: 0;
        margin: 20px auto;
    }

    .product-tabs-section .woocommerce-tabs .tabs.wc-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0;
    }

    .product-tabs-section .woocommerce-tabs .tabs.wc-tabs::-webkit-scrollbar {
        display: none;
    }

    .product-tabs-section .woocommerce-tabs .tabs.wc-tabs li {
        flex: 0 0 auto;
        min-width: min(48vw, 190px);
    }

    .product-tabs-section .woocommerce-tabs .tabs.wc-tabs li a {
        font-size: 0.875rem;
        white-space: nowrap;
        padding: 14px 16px;
    }

    .footer-stack {
        padding: 56px 20px 48px;
        gap: 22px;
    }

    .footer-bottom__inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
    }

    .site-logo {
        text-align: center;
        display: flex;
        justify-content: center;
    }

    .footer-logo {
        text-align: center;
        display: flex;
        justify-content: center;
    }

}

/* Stock Ticker Banner */
.stock-ticker {
    font-size: 15px;
    padding-block: 8px;
    border-block: 1px solid;
    overflow: hidden;
    user-select: none;
    background-color: var(--primary-color, #17a2b8);
    color: #fff;

    --gap: 30px;
    display: flex;
}

.stock-ticker ul {
    list-style: none;
    flex-shrink: 0;
    min-width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--gap);

    animation: scroll 50s linear infinite;
}

.stock-ticker:hover ul {
    animation-play-state: paused;
}

@keyframes scroll {
    to {
        transform: translateX(calc(-100% - var(--gap)));
    }
}

.stock-ticker .company,
.stock-ticker .price {
    font-weight: bold;
}

.stock-ticker .price {
    margin-inline: 4px;
}



.stock-ticker .plus .change,
.stock-ticker .plus::before {
    color: #089981;
}

.stock-ticker .minus .change,
.stock-ticker .minus::before {
    color: #f23645;
}

/* Mobile: Make ticker 3x faster */
@media (max-width: 768px) {
    .stock-ticker ul {
        animation: scroll 16.67s linear infinite;
    }
}

/* Accessibility: Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .stock-ticker ul {
        animation: none;
    }

    .latest-products-grid li,
    .related-products-grid li,
    .single-product-wrapper .product-intro,
    .single-product-wrapper .product-images,
    .single-product-wrapper .product-summary,
    .single-product-wrapper .acc-checkout-box,
    .single-product-wrapper .product-tabs-section,
    .single-product-wrapper .related-products-section {
        opacity: 1;
        animation: none;
        transform: none;
    }

    .single-product-wrapper .gallery-slide {
        transition: none;
    }
}

#comment {
    margin-top: 12px;
}

/* QuickFORM Checkout Icon Color Override */
.acc-checkout-box .acc-input-with-icon svg,
.acc-checkout-box svg:not(:root) {
    stroke: #333 !important;
}

/* QuickFORM availability green pulse dot */
.acc-availability-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #28a745;
    flex-shrink: 0;
    animation: acc-availability-pulse 1.5s ease-in-out infinite;
}

/* Variable products: dot only visible when container has .in-stock */
.acc-availability-info:not(.in-stock) .acc-availability-dot {
    display: none;
}

@keyframes acc-availability-pulse {
    0%, 100% {
        opacity: 1;
        box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.5);
    }
    50% {
        opacity: 0.9;
        box-shadow: 0 0 0 6px rgba(40, 167, 69, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .acc-availability-dot {
        animation: none;
    }
}
/* ==========================================================================
   PDP Trust / Guarantee badges (rendered after QuickFORM at summary prio 16)
   ========================================================================== */
.qt-trust-badges {
    list-style: none;
    margin: 8px 0 0;
    padding: 14px 8px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    border: 1px solid var(--qt-field-border, #e5e7eb);
    border-radius: var(--qt-field-radius, 12px);
    background: var(--qt-field-bg, #fff);
}
.qt-trust-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 4px 6px;
}
.qt-trust-badge:not(:last-child) {
    border-inline-end: 1px solid var(--qt-field-border, #eef0f2);
}
.qt-trust-badge__icon {
    display: inline-flex;
    color: var(--primary-color, #17a2b8);
}
.qt-trust-badge__icon svg {
    width: 26px;
    height: 26px;
}
.qt-trust-badge__body {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}
.qt-trust-badge__title {
    font-weight: 600;
    font-size: 13px;
    color: var(--qt-field-text, #1f2937);
}
.qt-trust-badge__text {
    font-size: 11px;
    color: var(--qt-label-color, #6b7280);
    margin-top: 2px;
}
@media (max-width: 480px) {
    .qt-trust-badges { padding: 12px 4px; gap: 4px; }
    .qt-trust-badge__title { font-size: 12px; }
    .qt-trust-badge__text { font-size: 10px; }
    .qt-trust-badge__icon svg { width: 22px; height: 22px; }
}

/* ==========================================================================
   PDP stock indicator — pulsing dot + label (Disponible / Stock faible / Non disponible)
   ========================================================================== */
.qt-stock {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}
.qt-stock__dot {
    position: relative;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}
.qt-stock__dot::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: inherit;
    animation: qt-stock-pulse 1.8s ease-out infinite;
}
.qt-stock--in  { color: #15803d; }
.qt-stock--in  .qt-stock__dot { background: #22c55e; }
.qt-stock--low { color: #b45309; }
.qt-stock--low .qt-stock__dot { background: #f59e0b; }
.qt-stock--out { color: #b91c1c; }
.qt-stock--out .qt-stock__dot { background: #ef4444; }
.qt-stock-oos { margin: 4px 0 0; }

@keyframes qt-stock-pulse {
    0%   { transform: scale(1);   opacity: 0.7; }
    70%  { transform: scale(2.6); opacity: 0; }
    100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .qt-stock__dot::before { animation: none; }
}

/* Out of stock: QF hides its form and prints its own message — suppress both;
   our "Non disponible" pill stands in its place. */
.qt-product-oos .acc-out-of-stock-message,
.qt-product-oos .acc-checkout-box,
.qt-product-oos .acc-accordion {
    display: none !important;
}

/* Desktop only: swap positions — category term above the title, stock pill below the price.
   (Mobile keeps the pill above the title and hides the category, per the max-width:768px rules.) */
@media (min-width: 769px) {
    .single-product-wrapper .product-intro {
        display: flex;
        flex-direction: column;
    }
}

/* ==========================================================================
   Side-cart free-shipping progress bar (QuickForm promo threshold)
   ========================================================================== */
.qt-fs-progress {
    margin: 0 0 14px;
    padding: 12px 14px;
    border: 1px solid var(--qt-field-border, #e5e7eb);
    border-radius: var(--qt-field-radius, 12px);
    background: var(--qt-field-bg, #fff);
}
.qt-fs-progress__label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--qt-field-text, #1f2937);
    margin-bottom: 8px;
}
.qt-fs-progress__icon {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--primary-color, #17a2b8);
}
.qt-fs-progress__icon svg {
    width: 20px;
    height: 20px;
}
.qt-fs-progress__text .woocommerce-Price-amount {
    font-weight: 700;
    color: var(--primary-color, #17a2b8);
}
.qt-fs-progress__track {
    height: 6px;
    border-radius: 999px;
    background: #edf0f3;
    overflow: hidden;
}
.qt-fs-progress__fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: var(--primary-color, #17a2b8);
    transition: width 0.4s ease;
}
.qt-fs-progress--done {
    border-color: #22c55e;
    background: #f0fdf4;
}
.qt-fs-progress--done .qt-fs-progress__icon,
.qt-fs-progress--done .qt-fs-progress__text {
    color: #15803d;
}
.qt-fs-progress--done .qt-fs-progress__fill {
    background: #22c55e;
}

/* ==========================================================================
   Shopify-style checkout shell
   Solid 2-col wrapper grid (no display:contents). Coupon UI lives inside the
   summary column. RTL via logical properties. Thank-you keeps normal chrome.
   ========================================================================== */

:root {
    --qt-co-rail-bg: #f4f5f7;
    --qt-co-border: #e3e6eb;
    --qt-co-content-max: 1660px;
    --qt-co-gutter: 64px;
    --qt-co-pad-x: 24px;
}

body.qt-checkout-shell #main.site-main,
body.qt-checkout-shell .site-main,
body.qt-checkout-shell #primary,
body.qt-checkout-shell .content-area,
body.qt-checkout-shell .woocommerce,
body.qt-checkout-shell .container {
    max-width: none;
    width: auto;
    margin: 0;
    padding: 0;
    background: transparent;
}

/* overflow-x:hidden on html/body kills position:sticky — use clip on shell */
html:has(body.qt-checkout-shell) {
    overflow-x: clip;
}

body.qt-checkout-shell {
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    overflow-x: clip;
    overflow-y: visible;
}

body.qt-checkout-shell .site-header,
body.qt-checkout-shell .site-footer,
body.qt-checkout-shell .qt-checkout-header,
body.qt-checkout-shell .qt-checkout-footer,
body.qt-checkout-shell .mobile-bottom-bar {
    display: none !important;
}

/* Default WC coupon must never appear above the shell split */
body.qt-checkout-shell .woocommerce-form-coupon-toggle,
body.qt-checkout-shell form.checkout_coupon {
    display: none !important;
}

body.qt-checkout-shell #main.site-main,
body.qt-checkout-shell .site-main {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    overflow: visible;
}

body.qt-checkout-shell .woocommerce {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

body.qt-checkout-shell .woocommerce-notices-wrapper:empty {
    display: none;
}

.qt-checkout-form--shell {
    max-width: none !important;
    width: 100%;
    position: relative;
    flex: 1 0 auto;
    display: block;
    margin: 0;
    padding: 0;
}

.qt-checkout-form--shell .qt-checkout-wrapper {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: calc(
        var(--qt-co-content-max)
        + var(--qt-co-pad-x)
        + var(--qt-co-pad-x)
    );
    width: 100%;
    margin-inline: auto;
    padding-inline: var(--qt-co-pad-x);
    box-sizing: border-box;
    align-items: start;
    overflow: visible;
}

/* Grey rail behind summary → viewport inline-end (mirrors in RTL) */
.qt-checkout-form--shell .qt-checkout-wrapper::before {
    content: "";
    position: absolute;
    inset-block: 0;
    inset-inline-start: 50%;
    inset-inline-end: calc(50% - 50vw);
    background: var(--qt-co-rail-bg);
    border-inline-start: 1px solid var(--qt-co-border);
    z-index: 0;
    pointer-events: none;
}

.qt-checkout-form--shell .qt-checkout-billing,
.qt-checkout-form--shell .qt-checkout-review {
    position: relative;
    z-index: 1;
    flex: none;
    width: auto;
    min-width: 0;
    max-width: none;
}

.qt-checkout-form--shell .qt-checkout-billing {
    padding-block: 40px 64px;
    padding-inline: 0 calc(var(--qt-co-gutter) / 2);
}

.qt-checkout-form--shell .qt-checkout-shell-logo {
    display: flex;
    align-items: center;
    min-height: 40px;
    margin: 0 0 28px;
}

.qt-checkout-form--shell .qt-checkout-shell-logo a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
    font-weight: 700;
    font-size: 1.5rem;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.qt-checkout-form--shell .qt-checkout-shell-logo img,
.qt-checkout-form--shell .qt-checkout-shell-logo .custom-logo {
    display: block;
    max-height: 40px;
    width: auto;
    height: auto;
}

.qt-checkout-form--shell .qt-checkout-billing .woocommerce-billing-fields > h3 {
    margin-top: 0;
}

/* Shipping + payment moved to left column (below order notes) */
.qt-checkout-form--shell .qt-checkout-shipping-slot {
    margin-top: 24px;
}

.qt-checkout-form--shell .qt-checkout-shipping-slot:empty {
    display: none;
}

.qt-checkout-form--shell .qt-checkout-shipping-slot .qt-shipping-package {
    margin: 0;
}

.qt-checkout-form--shell .qt-checkout-shipping-slot .qt-shipping-package__heading {
    margin: 0 0 10px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #111;
}

.qt-checkout-form--shell .qt-checkout-payment-slot {
    margin-top: 28px;
}

.qt-checkout-form--shell .qt-checkout-payment-slot #payment {
    margin: 0;
}

.qt-checkout-form--shell .qt-checkout-review {
    padding-block: 40px 64px;
    padding-inline: calc(var(--qt-co-gutter) / 2) 0;
    position: sticky;
    top: 24px;
    align-self: start;
    box-sizing: border-box;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.qt-checkout-form--shell .qt-checkout-review::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

@media (min-width: 901px) {
    .qt-checkout-form--shell .qt-checkout-review {
        position: sticky !important;
        top: 24px;
    }
}

.qt-checkout-form--shell .qt-order-review {
    background: transparent;
    border: 0;
    padding: 0;
    box-shadow: none;
    position: relative;
}

/* Expandable summary (right column) */
.qt-summary-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
    border: 0;
    background: none;
    color: #111;
    font-family: inherit;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    text-align: start;
    cursor: pointer;
}

.qt-summary-toggle__label {
    flex: 0 1 auto;
    min-width: 0;
}

.qt-summary-toggle__aside {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-inline-start: auto;
    flex-shrink: 0;
}

.qt-summary-toggle__total {
    display: inline-block;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.2;
    color: #111;
    white-space: nowrap;
    unicode-bidi: isolate;
    direction: ltr;
}

.qt-summary-toggle__total .woocommerce-Price-amount,
.qt-summary-toggle__total .amount {
    display: inline-block !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit;
    white-space: nowrap;
    text-transform: none;
    direction: ltr;
    unicode-bidi: isolate;
}

.qt-summary-toggle__chevron {
    display: inline-flex;
    flex-shrink: 0;
    color: #6b7280;
    transition: transform 0.28s ease;
}

.qt-summary-toggle__chevron svg {
    display: block;
    width: 20px;
    height: 20px;
}

/* Expanded = chevron points up (like reference) */
.qt-summary-toggle[aria-expanded="true"] .qt-summary-toggle__chevron {
    transform: rotate(180deg);
}

/* Smooth expand/collapse via grid (animates 0fr ↔ 1fr) */
.qt-summary-panel {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 0.35s ease;
}

.qt-summary-panel__inner {
    overflow: hidden;
    min-height: 0;
}

.qt-checkout-review.is-summary-collapsed .qt-summary-panel {
    grid-template-rows: 0fr;
}

@media (prefers-reduced-motion: reduce) {
    .qt-summary-panel,
    .qt-summary-toggle__chevron {
        transition: none;
    }
}

.qt-shell-coupon {
    margin: 0 0 20px;
}

.qt-shell-coupon__prompt {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
    color: #4b5563;
    text-align: start;
}

.qt-shell-coupon__toggle {
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--qt-checkout-accent, var(--primary-color, #1e1e1e));
    font: inherit;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

/* Smooth reveal — expand/collapse without display-toggle mid-animation.
   Toggle `.is-open`. Keep `[hidden]` off until the close transition ends.
   Timing: --qt-reveal-duration / --qt-reveal-ease / --qt-reveal-distance */
.qt-smooth-reveal {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    margin-block: 0;
    overflow: hidden;
    pointer-events: none;
    transition:
        grid-template-rows var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
        opacity var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease),
        margin var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease);
}

.qt-smooth-reveal.is-open {
    grid-template-rows: 1fr;
    opacity: 1;
    pointer-events: auto;
}

.qt-smooth-reveal__inner {
    min-height: 0;
    overflow: hidden;
    transform: translateY(calc(var(--qt-reveal-distance, 6px) * -1));
    transition: transform var(--qt-reveal-duration, 0.35s) var(--qt-reveal-ease, ease);
}

.qt-smooth-reveal.is-open .qt-smooth-reveal__inner {
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .qt-smooth-reveal,
    .qt-smooth-reveal__inner {
        transition: none;
    }

    .qt-smooth-reveal__inner {
        transform: none;
    }
}

/* Smooth coupon fields expand (0fr ↔ 1fr) */
.qt-shell-coupon__fields {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
}

.qt-shell-coupon.is-open .qt-shell-coupon__fields {
    grid-template-rows: 1fr;
}

.qt-shell-coupon__fields-inner {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    overflow: hidden;
    padding-top: 0;
    transition: padding-top 0.3s ease;
}

.qt-shell-coupon.is-open .qt-shell-coupon__fields-inner {
    padding-top: 10px;
}

.qt-shell-coupon__row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
    .qt-shell-coupon__fields,
    .qt-shell-coupon__fields-inner {
        transition: none;
    }
}

.qt-shell-coupon__input,
.qt-checkout-form--shell .qt-shell-coupon__input.input-text {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    box-sizing: border-box;
    min-height: var(--qt-field-height, 47px);
    height: var(--qt-field-height, 47px);
    max-height: var(--qt-field-height, 47px);
    margin: 0;
    padding: 8px 12px;
    border: var(--qt-field-border-w, 1.5px) solid var(--qt-field-border, #e2e8f0) !important;
    border-radius: var(--qt-field-radius, var(--theme-radius, 8px));
    background: var(--qt-field-bg, #fff);
    color: var(--qt-field-text, #1e293b);
    font-family: inherit;
    font-size: 14px;
    font-weight: var(--qt-checkout-input-weight, 500);
    line-height: 1.25;
    box-shadow: var(--qt-field-shadow);
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
    -webkit-appearance: none;
    appearance: none;
}

.qt-shell-coupon__input::placeholder {
    color: var(--qt-placeholder, #94a3b8);
    opacity: 1;
}

.qt-shell-coupon__input:focus,
.qt-checkout-form--shell .qt-shell-coupon__input.input-text:focus {
    border-color: var(--qt-checkout-accent, var(--primary-color)) !important;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
    outline: none;
}

.qt-shell-coupon.has-error .qt-shell-coupon__input,
.qt-shell-coupon.has-error .qt-shell-coupon__input.is-invalid,
.qt-checkout-form--shell .qt-shell-coupon.has-error .qt-shell-coupon__input.input-text {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 0.5px #dc2626, var(--qt-field-shadow);
}

.qt-shell-coupon.has-error .qt-shell-coupon__input:focus,
.qt-checkout-form--shell .qt-shell-coupon.has-error .qt-shell-coupon__input.input-text:focus {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 0.5px #dc2626, var(--qt-field-shadow);
}

.qt-shell-coupon__error {
    margin: 8px 0 0;
    padding: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    color: #dc2626;
    text-align: start;
}

.qt-shell-coupon__error[hidden] {
    display: none !important;
}

.qt-shell-coupon__apply,
.qt-checkout-form--shell .qt-shell-coupon__apply.button {
    flex: 0 0 auto;
    box-sizing: border-box;
    min-width: 7.5rem;
    width: auto;
    min-height: var(--qt-field-height, 47px);
    height: var(--qt-field-height, 47px);
    margin: 0;
    padding: 0 16px;
    border: none !important;
    border-radius: var(--qt-field-radius, var(--theme-radius, 8px));
    background: var(--qt-checkout-accent, var(--primary-color)) !important;
    color: #fff !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    box-shadow: var(--qt-field-shadow);
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.1s ease;
}

.qt-shell-coupon__apply:hover,
.qt-checkout-form--shell .qt-shell-coupon__apply.button:hover {
    opacity: 0.9;
    color: #fff !important;
}

.qt-shell-coupon__apply:focus,
.qt-checkout-form--shell .qt-shell-coupon__apply.button:focus {
    outline: none;
    box-shadow: 0 0 0 0.5px var(--qt-checkout-accent, var(--primary-color)), var(--qt-field-shadow);
}

.qt-shell-coupon__apply:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

@media (max-width: 380px) {
    .qt-shell-coupon__row {
        flex-wrap: wrap;
    }

    .qt-shell-coupon__apply,
    .qt-checkout-form--shell .qt-shell-coupon__apply.button {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 900px) {
    .qt-checkout-form--shell .qt-checkout-wrapper {
        display: flex;
        flex-direction: column;
        max-width: 620px;
        padding-inline: 20px;
    }

    .qt-checkout-form--shell .qt-checkout-wrapper::before {
        display: none;
    }

    .qt-checkout-form--shell .qt-checkout-billing {
        order: 2;
        padding: 28px 0 8px;
    }

    /* Full-bleed summary row (break out of wrapper padding) */
    .qt-checkout-form--shell .qt-checkout-review {
        order: 1;
        position: static !important;
        top: auto;
        max-height: none;
        overflow: visible;
        width: calc(100% + 40px);
        max-width: none;
        margin-inline: -20px;
        margin-block: 0 8px;
        padding: 20px;
        box-sizing: border-box;
        background: var(--qt-co-rail-bg);
        border-block: 1px solid var(--qt-co-border);
    }

    .qt-checkout-form--shell .qt-summary-toggle {
        margin-bottom: 0;
        transition: margin-bottom 0.35s ease;
    }

    .qt-checkout-form--shell .qt-checkout-review:not(.is-summary-collapsed) .qt-summary-toggle {
        margin-bottom: 16px;
    }

    .qt-checkout-form--shell .qt-order-review {
        background: transparent;
        border: 0;
        border-radius: 0;
        padding: 0;
    }
}

/* Desktop: summary panel always visible (toggle is mobile-only) */
@media (min-width: 901px) {
    .qt-checkout-form--shell .qt-summary-panel {
        display: grid !important;
        grid-template-rows: 1fr !important;
    }

    .qt-checkout-form--shell .qt-checkout-review.is-summary-collapsed .qt-summary-panel {
        grid-template-rows: 1fr !important;
    }

    .qt-checkout-form--shell .qt-summary-toggle {
        cursor: default;
        pointer-events: none;
    }

    .qt-checkout-form--shell .qt-summary-toggle__total,
    .qt-checkout-form--shell .qt-summary-toggle__chevron {
        display: none;
    }
}

/* ==========================================================================
   Order-review skeleton loader
   `.qt-checkout-review.is-loading` is toggled by checkout-skeleton.js around
   WooCommerce's update_checkout / updated_checkout events. The skeleton
   overlay lives inside .qt-order-review and shimmers over the stale totals.
   ========================================================================== */

.qt-order-review__skeleton {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 2;
    padding: 4px 0;
    background: transparent;
    flex-direction: column;
    gap: 16px;
    pointer-events: none;
}
/* Shell rail summary has no padding, so pad the skeleton to line up. */
.qt-checkout-form--shell .qt-order-review {
    position: relative;
}

.qt-checkout-review.is-loading .qt-order-review > *:not(.qt-order-review__skeleton) {
    opacity: 0;
    transition: opacity 0.12s ease;
}
.qt-checkout-review.is-loading .qt-order-review__skeleton {
    display: flex;
}

.qt-sk {
    display: block;
    border-radius: 6px;
    background: linear-gradient(
        100deg,
        rgba(0, 0, 0, 0.06) 30%,
        rgba(0, 0, 0, 0.11) 50%,
        rgba(0, 0, 0, 0.06) 70%
    );
    background-size: 200% 100%;
    animation: qt-sk-shimmer 1.2s ease-in-out infinite;
}
.qt-sk--line {
    height: 14px;
}
.qt-sk--w40 { width: 40%; }
.qt-sk--w50 { width: 50%; }
.qt-sk--w60 { width: 60%; }
.qt-sk--w70 { width: 70%; }
.qt-sk--w80 { width: 80%; }

@keyframes qt-sk-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
    .qt-sk {
        animation: none;
    }
}

/* ============================================
   Product Carousel Block (quicktheme/product-carousel)
   ============================================ */
.qt-product-carousel {
    --qt-carousel-columns: 4;
    --qt-carousel-gap: 24px;
    max-width: 1388px;
    margin: 48px auto;
    padding: 0 20px;
    position: relative;
}

/* Full/wide alignment opts out of the centred container */
.qt-product-carousel.alignfull {
    max-width: none;
    padding-inline: 48px;
}

.qt-product-carousel.alignwide {
    max-width: 1600px;
}

.qt-product-carousel__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.qt-product-carousel__title {
    margin: 0;
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 700;
    line-height: 1.2;
    color: #1a1a1a;
}

.qt-product-carousel__view-all {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    text-decoration: none;
    border-bottom: 1px solid currentColor;
    padding-bottom: 1px;
}

.qt-product-carousel__view-all:hover {
    opacity: 0.75;
}

.qt-product-carousel__viewport {
    position: relative;
}

/* Native scroll-snap track: touch/trackpad swiping needs no JS */
.qt-product-carousel__track,
.qt-product-carousel .products.qt-product-carousel__track,
.qt-color-filter .products.qt-product-carousel__track {
    display: flex !important;
    gap: var(--qt-carousel-gap);
    list-style: none;
    margin: 0 !important;
    padding: 0 0 4px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    /* Firefox / IE */
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.qt-product-carousel__track::-webkit-scrollbar {
    display: none;
}

/* WooCommerce adds clearfix pseudos to ul.products — they'd become flex items */
.qt-product-carousel__track::before,
.qt-product-carousel__track::after,
.woocommerce .qt-product-carousel__track::before,
.woocommerce .qt-product-carousel__track::after,
.woocommerce-page .qt-product-carousel__track::before,
.woocommerce-page .qt-product-carousel__track::after {
    content: none !important;
    display: none !important;
}

/* Beat WooCommerce's float + percentage width on li.product */
.qt-product-carousel__track > li.product,
.woocommerce .qt-product-carousel__track > li.product,
.woocommerce-page .qt-product-carousel__track > li.product,
ul.qt-product-carousel__track > li.product,
.qt-color-filter .qt-product-carousel__track > li.product {
    flex: 0 0 calc(
        (100% - (var(--qt-carousel-columns) - 1) * var(--qt-carousel-gap))
        / var(--qt-carousel-columns)
    );
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
    scroll-snap-align: start;
}

/* Arrow buttons — circular, vertically centred on the image area */
.qt-product-carousel__nav {
    position: absolute;
    top: 38%;
    transform: translateY(-50%);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #fff;
    color: #1a1a1a;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
    transition: background 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

.qt-product-carousel__nav:hover {
    background: #f5f5f5;
    transform: translateY(-50%) scale(1.06);
}

.qt-product-carousel__nav[hidden] {
    display: none;
}

.qt-product-carousel__nav--prev {
    left: 4px;
}

.qt-product-carousel__nav--next {
    right: 4px;
}

.qt-product-carousel__nav svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
}

.qt-carousel-empty {
    margin: 0;
    padding: 24px;
    text-align: center;
    color: #777;
    background: #fafafa;
    border: 1px dashed #ddd;
    border-radius: 8px;
}

/* Touch devices scroll natively — hide the arrows */
@media (hover: none) and (pointer: coarse) {
    .qt-product-carousel__nav {
        display: none !important;
    }
}

@media (max-width: 1100px) {
    .qt-product-carousel__track > li.product,
    .woocommerce .qt-product-carousel__track > li.product,
    ul.qt-product-carousel__track > li.product,
    .qt-color-filter .qt-product-carousel__track > li.product {
        flex-basis: calc((100% - 2 * var(--qt-carousel-gap)) / 3);
    }
}

@media (max-width: 768px) {
    .qt-product-carousel {
        margin: 32px auto;
        --qt-carousel-gap: 16px;
    }

    .qt-product-carousel.alignfull {
        padding-inline: 20px;
    }

    .qt-product-carousel__header {
        margin-bottom: 16px;
    }

    .qt-product-carousel__track > li.product,
    .woocommerce .qt-product-carousel__track > li.product,
    ul.qt-product-carousel__track > li.product,
    .qt-color-filter .qt-product-carousel__track > li.product {
        flex-basis: calc((100% - var(--qt-carousel-gap)) / 2);
    }
}

@media (max-width: 480px) {
    .qt-product-carousel__track > li.product,
    .woocommerce .qt-product-carousel__track > li.product,
    ul.qt-product-carousel__track > li.product,
    .qt-color-filter .qt-product-carousel__track > li.product {
        flex-basis: 68%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .qt-product-carousel__track {
        scroll-behavior: auto;
    }
}

/* ============================================
   Category Carousel Block (quicktheme/category-carousel)
   Shares the product carousel's shell (header, arrows, viewport); only the
   track and slide sizing differ.
   ============================================ */
.qt-category-carousel {
    --qt-carousel-columns: 4;
    --qt-carousel-gap: 24px;
    max-width: 1388px;
    margin: 48px auto;
    padding: 0 20px;
    position: relative;
}

.qt-category-carousel.alignfull {
    max-width: none;
    padding-inline: 48px;
}

.qt-category-carousel.alignwide {
    max-width: 1600px;
}

.qt-category-carousel__track {
    display: flex;
    gap: var(--qt-carousel-gap);
    list-style: none;
    margin: 0;
    padding: 0 0 4px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.qt-category-carousel__track::-webkit-scrollbar {
    display: none;
}

/* Override the theme's percentage-based .category-slide sizing (which is tuned
   for the homepage slider) with column-count-driven widths. */
.qt-category-carousel__track > .qt-category-carousel__slide,
.qt-category-carousel__track > .category-slide {
    flex: 0 0 calc(
        (100% - (var(--qt-carousel-columns) - 1) * var(--qt-carousel-gap))
        / var(--qt-carousel-columns)
    );
    min-width: 0;
    margin: 0;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
}

.qt-category-carousel__slide .category-image {
    /* Full-width card image, unlike the homepage slider's fixed circle.
       Square to match the other category tiles across the theme. */
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    margin: 0;
    overflow: hidden;
    border-radius: 12px;
    background: #f5f5f5;
}

.qt-category-carousel__slide .category-image img,
.qt-category-carousel__slide .category-image__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.qt-category-carousel__slide:hover .category-image img,
.qt-category-carousel__slide:hover .category-image__img {
    transform: scale(1.05);
}

/* The theme's .category-name rules are trapped inside a 768px media query,
   so desktop styling is restated here rather than inherited. */
.qt-category-carousel__slide .category-name {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    margin: 12px 0 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    text-align: center;
}

.qt-category-carousel__slide .category-name__count {
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    white-space: nowrap;
}

@media (hover: none) and (pointer: coarse) {
    .qt-category-carousel .qt-product-carousel__nav {
        display: none !important;
    }
}

@media (max-width: 1100px) {
    .qt-category-carousel__track > .qt-category-carousel__slide,
    .qt-category-carousel__track > .category-slide {
        flex-basis: calc((100% - 2 * var(--qt-carousel-gap)) / 3);
        min-width: 0;
    }
}

@media (max-width: 768px) {
    .qt-category-carousel {
        margin: 32px auto;
        --qt-carousel-gap: 16px;
    }

    .qt-category-carousel.alignfull {
        padding-inline: 20px;
    }

    .qt-category-carousel__track > .qt-category-carousel__slide,
    .qt-category-carousel__track > .category-slide {
        flex-basis: calc((100% - var(--qt-carousel-gap)) / 2);
        min-width: 0;
    }

    .qt-category-carousel__slide .category-image {
        width: 100%;
        height: auto;
    }

    .qt-category-carousel__slide .category-name {
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .qt-category-carousel__track > .qt-category-carousel__slide,
    .qt-category-carousel__track > .category-slide {
        flex-basis: 68%;
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .qt-category-carousel__track {
        scroll-behavior: auto;
    }

    .qt-category-carousel__slide:hover .category-image img {
        transform: none;
    }
}

/* ============================================
   Colour Filter Block (quicktheme/color-filter)
   Intro column + swatch row that swaps the product track.
   Reuses the product carousel's viewport/track/arrow classes.
   ============================================ */
.qt-color-filter {
    --qt-carousel-columns: 4;
    --qt-carousel-gap: 24px;
    --qt-swatch-size: 48px;
    max-width: 1388px;
    margin: 48px auto;
    padding: 0 20px;
    position: relative;
}

.qt-color-filter.alignfull {
    max-width: none;
    padding-inline: 48px;
}

.qt-color-filter.alignwide {
    max-width: 1600px;
}

.qt-color-filter__intro {
    max-width: 620px;
    margin-bottom: 32px;
}

.qt-color-filter__title {
    margin: 0 0 16px;
    font-size: clamp(24px, 2.6vw, 34px);
    font-weight: 700;
    line-height: 1.2;
    color: #1a1a1a;
}

.qt-color-filter__description {
    margin: 0 0 20px;
    font-size: 17px;
    line-height: 1.6;
    color: #4a4a4a;
}

.qt-color-filter__link {
    display: inline-block;
    margin-bottom: 28px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #1a1a1a;
    text-decoration: none;
    border-bottom: 2px solid currentColor;
    padding-bottom: 2px;
}

.qt-color-filter__link:hover {
    opacity: 0.65;
}

/* Swatch row — wraps onto as many lines as it needs */
.qt-color-filter__swatches {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
}

.qt-color-filter__swatch {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--qt-swatch-size);
    height: var(--qt-swatch-size);
    padding: 0;
    border-radius: 50%;
    background: var(--qt-swatch-color, #e5e5e5);
    /* Ring sits outside the dot so the colour stays a full circle. Strong
       enough that white/pale swatches still read against a white page. */
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.28);
    cursor: pointer;
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.qt-color-filter__swatch:hover {
    transform: scale(1.08);
}

.qt-color-filter__swatch:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 3px;
}

/* Active: outer ring with a gap, plus a checkmark drawn in CSS */
.qt-color-filter__swatch.is-active {
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px #1a1a1a;
}

.qt-color-filter__swatch.is-active::after {
    content: '';
    position: absolute;
    top: 46%;
    left: 50%;
    width: 8px;
    height: 15px;
    border: solid #fff;
    border-width: 0 2.5px 2.5px 0;
    transform: translate(-50%, -50%) rotate(45deg);
    /* Keeps the white tick legible on pale swatches */
    filter: drop-shadow(0 0 1.5px rgba(0, 0, 0, 0.7));
}

/* White and near-white swatches: the white tick would vanish, so darken it.
   Set per-term in render.php, which knows the actual hex. */
.qt-color-filter__swatch--light.is-active::after {
    border-color: #1a1a1a;
    filter: none;
}

/* Terms with no colour set fall back to a readable pill */
.qt-color-filter__swatch--noColor {
    width: auto;
    height: auto;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    background: #f2f2f2;
    color: #1a1a1a;
}

.qt-color-filter__swatch--noColor.is-active::after {
    content: none;
}

.qt-color-filter__swatch-label {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

.qt-color-filter__current {
    margin-left: 8px;
    font-size: 19px;
    font-style: italic;
    font-weight: 600;
    color: #1a1a1a;
}

/* Track fades slightly while new cards are fetched */
.qt-color-filter.is-loading .qt-product-carousel__track {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.qt-color-filter__empty {
    margin: 0;
    padding: 32px 24px;
    text-align: center;
    color: #777;
    background: #fafafa;
    border: 1px dashed #ddd;
    border-radius: var(--theme-radius, 8px);
}

@media (max-width: 768px) {
    .qt-color-filter {
        margin: 32px auto;
        --qt-carousel-gap: 16px;
        --qt-swatch-size: 42px;
    }

    .qt-color-filter.alignfull {
        padding-inline: 20px;
    }

    .qt-color-filter__intro {
        margin-bottom: 24px;
    }

    .qt-color-filter__description {
        font-size: 15px;
    }

    .qt-color-filter__swatches {
        gap: 12px;
    }

    .qt-color-filter__current {
        font-size: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .qt-color-filter__swatch {
        transition: none;
    }

    .qt-color-filter__swatch:hover {
        transform: none;
    }
}

/* ============================================
   Shop sidebar: colour swatches & attribute pills
   ============================================ */
.sf-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sf-swatches__item {
    margin: 0;
}

.sf-swatch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: var(--theme-radius, 8px);
    text-decoration: none;
    /* Ring sits outside the dot so the colour stays true */
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.16);
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.sf-swatch:hover {
    transform: scale(1.08);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.32);
}

.sf-swatch.is-active {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--primary-color, #111);
}

.sf-swatch:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--primary-color, #111);
}

.sf-swatch__dot {
    display: block;
    width: 28px;
    height: 28px;
    border-radius: var(--theme-radius, 8px);
    background: #e9e9e9;
}

/* Terms with no swatch colour fall back to a readable text chip */
.sf-swatch--nocolor {
    border-radius: 999px;
    padding: 6px 12px;
    box-shadow: none;
    border: 1px solid rgba(0, 0, 0, 0.16);
    font-size: 13px;
    color: #333;
}

.sf-swatch--nocolor .sf-swatch__dot {
    display: none;
}

.sf-swatch--nocolor.is-active {
    border-color: var(--primary-color, #111);
    background: var(--primary-color, #111);
    color: #fff;
    box-shadow: none;
}

/* ---- Generic attribute pills (sizes etc.) ---- */
.sf-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sf-pills__item {
    margin: 0;
}

.sf-attr-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 40px;
    padding: 7px 12px;
    border: 1px solid rgba(0, 0, 0, 0.16);
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    text-decoration: none;
    justify-content: center;
    transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.sf-attr-pill:hover {
    border-color: rgba(0, 0, 0, 0.4);
}

.sf-attr-pill.is-active {
    border-color: var(--primary-color, #111);
    background: var(--primary-color, #111);
    color: #fff;
}

.sf-attr-pill__count {
    font-size: 11px;
    opacity: 0.6;
}

.sf-attr-pill.is-active .sf-attr-pill__count {
    opacity: 0.85;
}

@media (max-width: 768px) {
    .sf-swatch__dot {
        width: 32px;
        height: 32px;
    }

    .sf-attr-pill {
        padding: 9px 14px;
    }
}

/* ============================================
   Product imagery: anchor crops to the top
   ----------------------------------------------------------------
   Product shots are square/portrait photos of a model wearing the item. When
   `object-fit: cover` crops them into a differently-shaped box it defaults to
   centring, which slices off the head. Anchoring to the top keeps the face and
   the garment's neckline — the part shoppers actually scan.

   Applies everywhere a product photo is cropped: shop/archive grids, the
   Gutenberg + Elementor carousels (both reuse content-product.php), related and
   upsell rows, the PDP gallery and its thumbnails, and cart/wishlist rows.
   Deliberately excluded: category tiles and tiny UI thumbnails, where the
   subject is a flat-lay or the image is too small for the anchor to matter.
   ============================================ */

/* Product cards — every context that renders content-product.php */
.product-card .product-image-wrapper img,
.product-card .product-image-wrapper .product-image,
.product-image-wrapper img,
.product-image-wrapper .product-image,
.woocommerce ul.products li.product .product-image-wrapper img,
.woocommerce-page ul.products li.product .product-image-wrapper img,
ul.products-grid li.product .product-image-wrapper img,
.latest-products-grid li.product .product-image-wrapper img,
.related-products-grid li.product .product-image-wrapper img,
.qt-product-carousel__track li.product .product-image-wrapper img,
.woocommerce ul.products li.product a.product-image-link img,
ul.products-grid li.product a.product-image-link img {
    object-position: top center !important;
}

/* PDP gallery: main slides and the thumbnail rail */
.gallery-slide img,
.gallery-slide .product-gallery-image,
.single-product-wrapper .gallery-slide img,
.single-product-wrapper .gallery-slide .product-gallery-image,
.gallery-thumb img,
.product-gallery__track img {
    object-position: top center !important;
}

/* WooCommerce's own product image markup (e.g. blocks that bypass the theme card) */
.woocommerce div.product div.images img,
.wc-block-grid__product-image img,
.wp-block-woocommerce-product-image img,
.wc-block-components-product-image img {
    object-position: top center;
}

/* Cart, mini-cart, wishlist and order rows still show the garment on a model */
.qt-mini-cart-item-image img,
.qt-order-item__thumb img,
.woocommerce-order-details .qt-order-item__thumb img,
body.qt-wishlist-page .wishlist_table .product-thumbnail img,
.qt-wishlist-toast__thumb,
.header-search-results__thumb {
    object-position: top center;
}

/* Category tiles stay square (1:1) but crop from the top too — their thumbnails
   are the same model shots, so centring cost them the same heads. */
.category-grid-image img,
.category-grid-image .category-image__img,
.subcat-slide-image img,
.product-categories-grid img,
.category-image img,
.category-image .category-image__img,
.qt-category-carousel__slide .category-image img,
.qt-category-carousel__slide .category-image .category-image__img {
    object-fit: cover;
    object-position: top center !important;
}

/* ============================================
   Unified QForm-style action buttons
   ----------------------------------------------------------------
   Public CTAs use the same compact premium surface as QForm: a fine inset
   highlight, a defined lower edge, and calm hover/pressed/focus states.
   Icon-only controls, sliders, quantity steppers and filter toggles are
   intentionally excluded so their shape and interaction remain unchanged.
   ============================================ */
:root {
    --qt-button-bg: var(--primary-color);
    --qt-button-bg-hover: color-mix(in srgb, var(--primary-color) 88%, #000);
    --qt-button-bg-pressed: color-mix(in srgb, var(--primary-color) 74%, #000);
    --qt-button-edge: color-mix(in srgb, var(--primary-color) 72%, #000);
    --qt-button-focus: color-mix(in srgb, var(--primary-color) 45%, transparent);
}

/* Every text action gets the same premium depth, including secondary and
   brand-colour buttons whose existing surface colour should be preserved. */
body :is(
    .qt-button,
    .shop-button,
    .more-products-button,
    .search-popup-submit,
    .sf-price-apply,
    .sticky-bottom-cta,
    .shop-load-more-btn,
    .qt-reviews-write-btn,
    .qt-pay-button,
    .qt-mini-cart-button,
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .wishlist_table .product-add-to-cart .button,
    .yith_wcwl_footer_additional_action input[type="submit"],
    .yith_wcwl_wishlist_update .button,
    .elementor-button,
    .wp-element-button,
    .wpcf7-submit,
    .qf-submit:not(.qf-btn-success),
    .qf-social-btn,
    .qf-crosssell-btn,
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
) {
    font-family: inherit;
    text-decoration: none;
    box-shadow:
        inset 0 0.75px 0 rgb(255 255 255 / 0.2),
        0 1px 2px rgb(0 0 0 / 0.16),
        0 0 0 1px color-mix(in srgb, var(--qt-action-edge, var(--qt-button-edge)) 70%, transparent) !important;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        color 160ms ease,
        box-shadow 160ms ease,
        opacity 160ms ease !important;
}

/* Filled actions. Local custom properties retain QuickFORM, checkout, and
   review accent colours while sharing one interaction model. */
body :is(
    .qt-button,
    .shop-button,
    .more-products-button,
    .search-popup-submit,
    .sf-price-apply,
    .sticky-bottom-cta,
    .shop-load-more-btn,
    .qt-pay-button,
    .qt-mini-cart-checkout,
    .qt-checkout,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .wishlist_table .product-add-to-cart .button,
    .yith_wcwl_footer_additional_action input[type="submit"],
    .yith_wcwl_wishlist_update .button,
    .elementor-button,
    .wp-element-button,
    .wpcf7-submit,
    .qf-submit:not(.qf-btn-success),
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .qt-reviews-write-btn,
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
) {
    --qt-action-bg: var(--qt-button-bg);
    --qt-action-hover: var(--qt-button-bg-hover);
    --qt-action-pressed: var(--qt-button-bg-pressed);
    --qt-action-edge: var(--qt-button-edge);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid var(--qt-action-edge) !important;
    border-radius: var(--theme-radius, 8px) !important;
    background: var(--qt-action-bg) !important;
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
    cursor: pointer;
}

/* WooCommerce's legacy review rule has extra specificity; keep its submit on
   the same 44px baseline and visible premium edge as the other form actions. */
body #review_form .form-submit input#submit,
body #review_form .form-submit input.submit,
body #review_form .form-submit button[type="submit"] {
    min-height: 44px;
    border: 1px solid var(--qt-action-edge, var(--qt-button-edge)) !important;
}

body :is(.qf-submit:not(.qf-btn-success), #qf-apply-coupon) {
    --qt-action-bg: var(--qf-theme, var(--qt-button-bg));
    --qt-action-hover: color-mix(in srgb, var(--qt-action-bg) 88%, #000);
    --qt-action-pressed: color-mix(in srgb, var(--qt-action-bg) 74%, #000);
    --qt-action-edge: color-mix(in srgb, var(--qt-action-bg) 72%, #000);
    border: 1px solid var(--qt-action-edge) !important;
    background: var(--qt-action-bg) !important;
    color: #fff !important;
}

body :is(
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    #place_order
) {
    --qt-action-bg: var(--qt-checkout-accent, var(--qf-theme, var(--qt-button-bg)));
    --qt-action-hover: color-mix(in srgb, var(--qt-action-bg) 88%, #000);
    --qt-action-pressed: color-mix(in srgb, var(--qt-action-bg) 74%, #000);
    --qt-action-edge: color-mix(in srgb, var(--qt-action-bg) 72%, #000);
    border: 1px solid var(--qt-action-edge) !important;
    background: var(--qt-action-bg) !important;
    color: #fff !important;
}

body :is(
    .qt-reviews-write-btn,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
) {
    --qt-action-bg: var(--qt-reviews-cta-bg, var(--qt-button-bg));
    --qt-action-hover: var(--qt-reviews-cta-hover, color-mix(in srgb, var(--qt-action-bg) 88%, #000));
    --qt-action-pressed: color-mix(in srgb, var(--qt-action-bg) 74%, #000);
    --qt-action-edge: color-mix(in srgb, var(--qt-action-bg) 72%, #000);
    border: 1px solid var(--qt-action-edge) !important;
    background: var(--qt-action-bg) !important;
    color: #fff !important;
}

body :is(
    .qt-button,
    .shop-button,
    .more-products-button,
    .search-popup-submit,
    .sf-price-apply,
    .sticky-bottom-cta,
    .shop-load-more-btn,
    .qt-reviews-write-btn,
    .qt-pay-button,
    .qt-mini-cart-checkout,
    .qt-checkout,
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .wishlist_table .product-add-to-cart .button,
    .yith_wcwl_footer_additional_action input[type="submit"],
    .yith_wcwl_wishlist_update .button,
    .elementor-button,
    .wp-element-button,
    .wpcf7-submit,
    .qf-submit:not(.qf-btn-success),
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
):hover:not(:disabled):not([aria-disabled="true"]) {
    background: var(--qt-action-hover, var(--qt-button-bg-hover)) !important;
    border-color: var(--qt-action-hover, var(--qt-button-bg-hover)) !important;
    color: #fff !important;
    opacity: 1;
    transform: none !important;
    box-shadow:
        inset 0 0.75px 0 rgb(255 255 255 / 0.2),
        0 1px 2px rgb(0 0 0 / 0.2),
        0 0 0 1px color-mix(in srgb, var(--qt-action-hover, var(--qt-button-bg-hover)) 74%, transparent) !important;
}

body :is(
    .qt-button,
    .shop-button,
    .more-products-button,
    .search-popup-submit,
    .sf-price-apply,
    .sticky-bottom-cta,
    .shop-load-more-btn,
    .qt-reviews-write-btn,
    .qt-pay-button,
    .qt-mini-cart-checkout,
    .qt-checkout,
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .wishlist_table .product-add-to-cart .button,
    .yith_wcwl_footer_additional_action input[type="submit"],
    .yith_wcwl_wishlist_update .button,
    .elementor-button,
    .wp-element-button,
    .wpcf7-submit,
    .qf-submit:not(.qf-btn-success),
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
):active:not(:disabled):not([aria-disabled="true"]) {
    background: var(--qt-action-pressed, var(--qt-button-bg-pressed)) !important;
    border-color: var(--qt-action-pressed, var(--qt-button-bg-pressed)) !important;
    transform: none !important;
    box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.18) !important;
}

body :is(
    .qt-button,
    .shop-button,
    .more-products-button,
    .search-popup-submit,
    .sf-price-apply,
    .sticky-bottom-cta,
    .shop-load-more-btn,
    .qt-reviews-write-btn,
    .qt-pay-button,
    .qt-mini-cart-button,
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .wishlist_table .product-add-to-cart .button,
    .yith_wcwl_footer_additional_action input[type="submit"],
    .yith_wcwl_wishlist_update .button,
    .elementor-button,
    .wp-element-button,
    .wpcf7-submit,
    .qf-submit:not(.qf-btn-success),
    .qf-add-to-cart,
    .qf-social-btn,
    .qf-crosssell-btn,
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
):focus-visible {
    outline: none !important;
    box-shadow:
        inset 0 0.75px 0 rgb(255 255 255 / 0.2),
        0 1px 2px rgb(0 0 0 / 0.16),
        0 0 0 2px #fff,
        0 0 0 4px var(--qt-button-focus) !important;
}

body :is(
    .shop-load-more-btn,
    .qt-proceed-checkout .checkout-button,
    .qt-shell-coupon__apply,
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .woocommerce-MyAccount-content .button,
    .woocommerce-cart-form .coupon .button,
    .checkout_coupon .button,
    .qf-submit,
    .qf-add-to-cart,
    #qf-apply-coupon,
    #place_order,
    #review_form input[type="submit"],
    #review_form button[type="submit"]
):disabled {
    cursor: not-allowed !important;
    opacity: 0.55 !important;
    box-shadow: none !important;
}

/* QuickFORM "add to cart" is the SECONDARY action beside the order button: same geometry
   as the filled actions, outlined instead of filled, so "Commander" keeps the visual weight.
   It is deliberately absent from the filled/decorated :is() lists above — those carry an ID
   selector (#qf-apply-coupon, #place_order), which gives them ID-level specificity that no
   reasonable class selector here could outrank. Excluding it beats fighting the cascade. */
body .qf-add-to-cart:not(.qf-btn-success) {
    --qt-atc-accent: var(--qf-theme, var(--qt-button-bg));
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 10px 18px;
    border-radius: var(--theme-radius, 8px) !important;
    background: transparent !important;
    color: var(--qt-atc-accent) !important;
    border: 1px solid color-mix(in srgb, var(--qt-atc-accent) 42%, transparent) !important;
    box-shadow: none !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        color 160ms ease !important;
}

/* Icon + label are currentColor, so they track the accent automatically. */
body .qf-add-to-cart:not(.qf-btn-success):hover:not(:disabled):not([aria-disabled="true"]) {
    background: color-mix(in srgb, var(--qt-atc-accent) 8%, transparent) !important;
    border-color: color-mix(in srgb, var(--qt-atc-accent) 68%, transparent) !important;
    color: var(--qt-atc-accent) !important;
    box-shadow: none !important;
    transform: none !important;
}

body .qf-add-to-cart:not(.qf-btn-success):active:not(:disabled):not([aria-disabled="true"]) {
    background: color-mix(in srgb, var(--qt-atc-accent) 15%, transparent) !important;
    border-color: var(--qt-atc-accent) !important;
    color: var(--qt-atc-accent) !important;
    box-shadow: none !important;
    transform: none !important;
}

body .qf-add-to-cart:not(.qf-btn-success):focus-visible {
    outline: none !important;
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px var(--qt-button-focus) !important;
}

@media (prefers-reduced-motion: reduce) {
    body :is(
        .qt-button,
        .shop-button,
        .more-products-button,
        .search-popup-submit,
        .sf-price-apply,
        .sticky-bottom-cta,
        .shop-load-more-btn,
        .qt-reviews-write-btn,
        .qt-pay-button,
        .qt-mini-cart-button,
        .qt-proceed-checkout .checkout-button,
        .qt-shell-coupon__apply,
            .elementor-button,
        .wp-element-button,
        .wpcf7-submit,
        .qf-submit,
        .qf-add-to-cart,
        .qf-social-btn,
        .qf-crosssell-btn,
        #qf-apply-coupon,
        #place_order
    ) {
        animation: none !important;
        transition: none !important;
    }
}



@media (max-width: 768px) {
    .product-card .product-card__cta.qt-button {
        min-height: 38px !important;
        padding: 8px 12px;
        font-size: 12px;
        font-weight: 500 !important;
        line-height: 1.25;
    }
}

@media (max-width: 480px) {
    .product-card .product-card__cta.qt-button {
        min-height: 38px !important;
        padding: 7px 10px;
        font-size: 12px;
        font-weight: 500 !important;
    }
}

/* Trust badge dividers live on the base rule via border-inline-end, which
   already resolves per direction — no [dir="rtl"] override (it double-flips). */