/* ============================================================
   KSWX WooCommerce skin — matches KSWX dark/gold brand.
   Palette: gold hsl(42,80%,55%), dark #15192a / #1b2232.
   Loaded only on Woo pages (see functions.php).
   ============================================================ */
:root {
    --kswx-gold:        hsl(42, 80%, 55%);
    --kswx-gold-dark:   hsl(42, 80%, 49%);
    --kswx-navy:        #15192a;
    --kswx-navy-2:      #1b2232;
    --kswx-ink:         #1f2533;
    --kswx-muted:       #5a6478;
    --kswx-line:        #e6e8ee;
}

/* ---- generic Woo button → KSWX accent ---- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #place_order {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    background: linear-gradient(180deg, hsl(42,82%,58%), hsl(42,80%,50%));
    color: var(--kswx-navy);
    font-weight: 600;
    font-size: .9rem;
    line-height: 1.2;
    letter-spacing: .01em;
    border-radius: .6rem;
    padding: .72rem 1.4rem;
    border: 1px solid transparent;
    box-shadow: 0 4px 12px rgba(232,177,48,.25);
    text-transform: none;
    transition: transform .18s ease, box-shadow .18s ease, background .25s ease, color .25s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #place_order:hover {
    background: linear-gradient(180deg, hsl(42,84%,55%), hsl(42,82%,46%));
    color: var(--kswx-navy);
    transform: translateY(-2px);
    box-shadow: 0 7px 18px rgba(232,177,48,.38);
}
.woocommerce a.button:active,
.woocommerce button.button:active { transform: translateY(0); box-shadow: 0 3px 9px rgba(232,177,48,.3); }

/* cart icon on add-to-cart buttons (loop + single) */
.woocommerce a.add_to_cart_button::before,
.woocommerce button.single_add_to_cart_button::before {
    content: "";
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    background-color: currentColor;
    -webkit-mask: var(--kswx-cart-icon) center / contain no-repeat;
            mask: var(--kswx-cart-icon) center / contain no-repeat;
}
:root {
    --kswx-cart-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12'/%3E%3C/svg%3E");
}
/* "added / view cart" secondary state stays subtle */
.woocommerce a.added_to_cart {
    display: inline-flex;
    align-items: center;
    margin-top: .4rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--kswx-navy-2);
    text-decoration: underline;
}
.woocommerce a.button.wc-backward,
.woocommerce a.button.outline {
    background: #fff;
    border-color: var(--kswx-line);
    color: var(--kswx-ink);
    box-shadow: none;
}
.woocommerce a.button.wc-backward::before { display: none; }

/* ---- prices in gold ---- */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce .product-item .price {
    color: var(--kswx-ink);
    font-weight: 700;
}
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins { text-decoration: none; }
.woocommerce .price .woocommerce-Price-amount { color: var(--kswx-ink); }
.woocommerce .price del .woocommerce-Price-amount { color: var(--kswx-muted); }

/* small excl/incl BTW suffix */
.woocommerce .price small.woocommerce-price-suffix {
    color: var(--kswx-muted);
    font-size: .72em;
    font-weight: 500;
}

/* ============================================================
   SHOP ARCHIVE — clean Base44-style dark grid.
   Sits between the dark KSWX header & footer.
   ============================================================ */
/* archive header (title / count / ordering) — light page */
body.archive.woocommerce .woocommerce-products-header__title,
body.archive.woocommerce .page-title { color: var(--kswx-ink); }
body.archive.woocommerce .woocommerce-result-count { color: var(--kswx-muted); }
body.archive.woocommerce .woocommerce-ordering select {
    background: #fff;
    border: 1px solid var(--kswx-line);
    border-radius: .45rem;
    padding: .5rem .7rem;
    color: var(--kswx-ink);
}
body.archive.woocommerce .woocommerce-breadcrumb { color: var(--kswx-muted); }
body.archive.woocommerce .woocommerce-breadcrumb a { color: var(--kswx-navy-2); }

/* ---- the grid ---- */
body.archive.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}
/* WooCommerce clearfix pseudo-elements become phantom grid cells that
   eat the first slot — neutralise them. */
body.archive.woocommerce ul.products::before,
body.archive.woocommerce ul.products::after {
    display: none !important;
    content: none !important;
}
@media (min-width: 600px)  { body.archive.woocommerce ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { body.archive.woocommerce ul.products { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1280px) { body.archive.woocommerce ul.products { grid-template-columns: repeat(5, 1fr); } }

/* neutralise theme's float/width on li */
body.archive.woocommerce ul.products li.product {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    clear: none !important;
}

/* ---- card ---- */
.woocommerce .kswx-card {
    background: #1b2232;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: .8rem;
    overflow: hidden;
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.woocommerce .kswx-card:hover {
    border-color: rgba(232,177,48,.45);
    box-shadow: 0 12px 30px rgba(0,0,0,.4);
    transform: translateY(-3px);
}
.woocommerce .kswx-card__link { display: block; text-decoration: none; }

.woocommerce .kswx-card__media {
    position: relative;
    aspect-ratio: 1 / 1;
    background: #fff;
    overflow: hidden;
}
.woocommerce ul.products li.product .kswx-card__media img:not(.kswx-card__wm) {
    width: 100% !important;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    padding: 12px;
    display: block;
}
.woocommerce ul.products li.product .kswx-card__media img.kswx-card__wm {
    position: absolute;
    right: 7px; bottom: 7px;
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
    padding: 0 !important;
    object-fit: contain;
    opacity: .85;
    pointer-events: none;
}
.woocommerce .kswx-card__sale {
    position: absolute;
    left: 8px; top: 8px;
    background: var(--kswx-gold);
    color: var(--kswx-navy);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 2px 8px;
    border-radius: 999px;
}

.woocommerce .kswx-card__body { padding: 12px 13px 14px; }
.woocommerce .kswx-card__title {
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.32;
    color: #e9ebf2;
    margin: 0 0 8px;
    min-height: 2.1em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.woocommerce .kswx-card:hover .kswx-card__title { color: #fff; }
.woocommerce .kswx-card__price {
    font-size: .98rem;
    font-weight: 700;
    color: var(--kswx-gold);
    line-height: 1.2;
}
.woocommerce .kswx-card__price .woocommerce-Price-amount { color: var(--kswx-gold); }
.woocommerce .kswx-card__price .woocommerce-price-suffix {
    display: block;
    margin-top: 2px;
    font-size: .68rem;
    font-weight: 500;
    color: rgba(255,255,255,.4);
}

/* pagination on dark */
body.archive.woocommerce .woocommerce-pagination { margin-top: 36px; }
body.archive.woocommerce .woocommerce-pagination ul { border: 0; }
body.archive.woocommerce .woocommerce-pagination a,
body.archive.woocommerce .woocommerce-pagination span {
    background: #fff;
    color: var(--kswx-ink);
    border: 1px solid var(--kswx-line);
    border-radius: .4rem;
    margin: 0 3px;
}
body.archive.woocommerce .woocommerce-pagination span.current,
body.archive.woocommerce .woocommerce-pagination a:hover {
    background: var(--kswx-gold);
    color: var(--kswx-navy);
    border-color: var(--kswx-gold);
}

/* ---- single product ---- */
.woocommerce div.product .product_title { color: var(--kswx-ink); font-weight: 700; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    border-bottom-color: var(--kswx-gold);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--kswx-ink); }
.woocommerce span.onsale {
    background: var(--kswx-gold);
    color: var(--kswx-navy);
    border-radius: 999px;
    font-weight: 700;
}
.woocommerce .product_meta { font-size: .85rem; color: var(--kswx-muted); }
.woocommerce .product_meta .sku { color: var(--kswx-ink); font-weight: 600; }

/* quantity input */
.woocommerce .quantity input.qty {
    border: 1px solid var(--kswx-line);
    border-radius: .4rem;
    padding: .5rem;
}

/* ---- notices / accents in gold ---- */
.woocommerce-message,
.woocommerce-info { border-top-color: var(--kswx-gold); }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--kswx-gold); }
.woocommerce a { color: var(--kswx-navy-2); }
.woocommerce a:hover { color: var(--kswx-gold-dark); }

/* ---- cart & checkout tables ---- */
.woocommerce table.shop_table { border-radius: .6rem; border-color: var(--kswx-line); }
.woocommerce table.shop_table th { color: var(--kswx-ink); }
.woocommerce-cart .cart-collaterals .cart_totals h2,
.woocommerce-checkout #order_review_heading,
.woocommerce form .form-row label { color: var(--kswx-ink); }
.woocommerce .cart_totals .order-total .woocommerce-Price-amount { color: var(--kswx-ink); font-weight: 700; }

/* coupon / inputs */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout .input-text,
.select2-container .select2-selection {
    border: 1px solid var(--kswx-line) !important;
    border-radius: .45rem;
}

/* ---- breadcrumb ---- */
.woocommerce .woocommerce-breadcrumb { color: var(--kswx-muted); font-size: .85rem; }
.woocommerce .woocommerce-breadcrumb a { color: var(--kswx-navy-2); }

/* ---- shop & product-category archive top bar → homepage hero image ----
   ONLY the catalog archives. All other pages (cart, checkout, account,
   product, generic pages) use the site header image (theme_mod). */
body.woocommerce-shop .innerbanner,
body.post-type-archive-product .innerbanner,
body.tax-product_cat .innerbanner {
    background-image: url("../images/hero-bg.png") !important;
    background-position: center center !important;
    background-size: cover !important;
}

/* ============================================================
   SHOP CARD — quantity stepper + AJAX add-to-cart (loop only).
   Lives OUTSIDE .kswx-card__link so clicks don't navigate.
   ============================================================ */
.woocommerce .kswx-card__cart {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
    padding: 0 13px 14px;
}
.woocommerce .kswx-card__cart .kswx-qty {
    display: inline-flex;
    align-items: stretch;
    flex: 0 0 auto;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: .55rem;
    overflow: hidden;
    background: rgba(255,255,255,.04);
}
.woocommerce .kswx-card__cart .kswx-qty__btn {
    width: 32px;
    min-height: 38px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--kswx-gold);
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    -webkit-appearance: none;
            appearance: none;
    transition: background .18s ease, color .18s ease;
}
.woocommerce .kswx-card__cart .kswx-qty__btn:hover {
    background: rgba(232,177,48,.16);
    color: #fff;
}
.woocommerce .kswx-card__cart .kswx-qty__input {
    width: 52px;
    border: 0;
    border-left: 1px solid rgba(255,255,255,.1);
    border-right: 1px solid rgba(255,255,255,.1);
    background: transparent;
    color: #fff;
    text-align: center;
    font-size: .9rem;
    font-weight: 600;
    -moz-appearance: textfield;
}
.woocommerce .kswx-card__cart .kswx-qty__input::-webkit-outer-spin-button,
.woocommerce .kswx-card__cart .kswx-qty__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.woocommerce .kswx-card__cart .kswx-card__add {
    flex: 1 1 96px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    min-height: 38px;
    padding: .4rem .7rem;
    border: 1px solid transparent;
    border-radius: .55rem;
    background: linear-gradient(180deg, hsl(42,82%,58%), hsl(42,80%,50%));
    color: var(--kswx-navy);
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(232,177,48,.22);
    -webkit-appearance: none;
            appearance: none;
    transition: transform .18s ease, box-shadow .18s ease, background .25s ease;
}
.woocommerce .kswx-card__cart .kswx-card__add::before {
    content: "";
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    background-color: currentColor;
    -webkit-mask: var(--kswx-cart-icon) center / contain no-repeat;
            mask: var(--kswx-cart-icon) center / contain no-repeat;
}
.woocommerce .kswx-card__cart .kswx-card__add:hover {
    background: linear-gradient(180deg, hsl(42,84%,55%), hsl(42,82%,46%));
    transform: translateY(-2px);
    box-shadow: 0 7px 18px rgba(232,177,48,.34);
}
.woocommerce .kswx-card__cart .kswx-card__add:active { transform: translateY(0); }
.woocommerce .kswx-card__cart .kswx-card__add.loading { opacity: .65; pointer-events: none; }
.woocommerce .kswx-card__cart .kswx-card__add.added {
    background: linear-gradient(180deg, hsl(140,45%,52%), hsl(140,45%,44%));
    box-shadow: 0 4px 12px rgba(60,180,90,.3);
}
/* link-style fallback button (out-of-stock / non-simple products) — no cart icon */
.woocommerce .kswx-card__cart .kswx-card__add--link::before { display: none; }

/* tighten on the smallest (2-col) layout */
@media (max-width: 480px) {
    .woocommerce .kswx-card__cart { gap: 6px; padding: 0 10px 12px; }
    .woocommerce .kswx-card__cart .kswx-card__add { font-size: .76rem; padding: .4rem .5rem; }
    .woocommerce .kswx-card__cart .kswx-qty__btn { width: 28px; }
    .woocommerce .kswx-card__cart .kswx-qty__input { width: 44px; }
}

/* WooCommerce auto "view cart" link has no place on the compact loop card */
.woocommerce .kswx-card__cart .added_to_cart { display: none; }
