/*
 * Enter any custom CSS here.
 * This file will not be overwritten by theme updates.
 *
 * ── Semantic class hooks (sa-*) ────────────────────────────────────────────
 * Every section, snippet and key element carries a stable `sa-` class you can
 * target with plain CSS — no Tailwind rebuild needed. These classes ship with
 * NO styles of their own; they exist purely as selectors for you to hook onto.
 *
 * Page scope   body.sa-tpl-<template>      e.g. .sa-tpl-product, .sa-tpl-shop
 *              body.sa-no-product-images / .sa-no-category-images when the
 *              matching theme setting is off
 * Chrome       .sa-header .sa-navbar .sa-footer
 *              .sa-navbar-link .sa-navbar-logo .sa-navbar-cart .sa-footer-link
 * Sections     .sa-<component>             e.g. .sa-hero, .sa-features, .sa-faq
 *   variant    .sa-<component>--<variant>  e.g. .sa-hero--split-media
 *   inner      .sa-<component>-title / -subtitle / -eyebrow / -media /
 *              -items / -item / -actions / -link / -price / -badge / -icon
 * Primitives   .sa-btn (+ .sa-btn--<variant>), .sa-section-header
 *              (.sa-section-title / -eyebrow / -subtitle),
 *              .sa-product-card (+ .sa-product-card--<style>,
 *              .sa-product-card-title / -price / -stock / -status / -badges),
 *              .sa-product-form + .sa-add-to-cart, .sa-product-gallery,
 *              .sa-cart-panel + .sa-cart-item, .sa-searchbar, .sa-pagination,
 *              .sa-breadcrumbs, .sa-toasts + .sa-toast, .sa-feedback-card
 *
 * Example — bigger hero heading only on the product page:
 *   .sa-tpl-product .sa-hero-title { font-size: 3rem; }
 * ───────────────────────────────────────────────────────────────────────────
*/

/* ═══ Thund3r-Tools — bluish-cyan glossy powder coat ═══ */
:root{--th-ln:rgba(103,232,249,.26);--th-glass:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 42%),rgba(8,28,46,.62)}
/* glass panels */
.sa-product-card,.sa-cart-panel,.sa-feedback-card,.sa-page-product-card,.sa-features-item,.sa-steps-item,.sa-stats-item,.sa-faq-item,.sa-page-products-sidebar{
  background:var(--th-glass)!important;border:1px solid var(--th-ln)!important;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(0,0,0,.35),0 14px 44px rgba(0,170,255,.12)}
.sa-product-card:hover{border-color:#22d3ee!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 34px rgba(34,211,238,.35)}
/* glossy shine on product images */
.sa-product-card img{transition:transform .35s}
.sa-product-card:hover img{transform:scale(1.04)}
.sa-product-card [class*="aspect"],.sa-product-card .sa-product-card-media{position:relative;overflow:hidden}
.sa-product-card [class*="aspect"]::after,.sa-product-card .sa-product-card-media::after{content:"";position:absolute;left:-30%;top:-60%;width:160%;height:100%;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent);transform:rotate(-8deg);pointer-events:none}
/* buttons: glossy cyan */
.sa-btn--primary,.sa-add-to-cart,.sa-btn[class*="primary"]{
  background:linear-gradient(180deg,#e6fdff,#67e8f9 55%,#38bdf8)!important;color:#02202b!important;font-weight:800;
  border:1px solid rgba(255,255,255,.6)!important;box-shadow:inset 0 2px 0 rgba(255,255,255,.9),0 8px 30px rgba(34,211,238,.4)}
.sa-btn--primary:hover,.sa-add-to-cart:hover{box-shadow:inset 0 2px 0 rgba(255,255,255,.9),0 0 34px rgba(34,211,238,.55)}
.sa-btn--secondary,.sa-btn[class*="outline"]{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02))!important;border:1px solid var(--th-ln)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
/* navbar glass + pill links */
.sa-header,.sa-navbar{background:var(--th-glass)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--th-ln)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.sa-navbar-link{border:1px solid var(--th-ln);border-radius:14px;padding:.45rem .9rem!important;font-weight:700;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.25);transition:.2s}
.sa-navbar-link:hover{border-color:#22d3ee;box-shadow:0 0 22px rgba(34,211,238,.35)}
/* brand wordmark gradient */
.sa-navbar-logo span,.sa-footer .font-heading{background:linear-gradient(180deg,#fff,#7ee9ff 60%,#38bdf8);-webkit-background-clip:text;background-clip:text;color:transparent!important;font-weight:900}
/* hero + section titles */
.sa-hero-title,.sa-section-title{filter:drop-shadow(0 0 22px rgba(34,211,238,.28))}
/* category sidebar active */
.sa-page-products-link[aria-current="page"]{background:linear-gradient(180deg,rgba(34,211,238,.42),rgba(59,130,246,.28))!important;color:#fff!important;border:1px solid var(--th-ln);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
/* inputs */
input,select,textarea{background:rgba(8,28,46,.7)!important}
input:focus,select:focus,textarea:focus{border-color:#22d3ee!important;box-shadow:0 0 22px rgba(34,211,238,.3)!important}