/* ============================================
   BUTTONS
   ============================================ */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; padding:0 24px; border-radius:var(--r-md); font-size:14px; font-weight:600; font-family:var(--fb); line-height:1; letter-spacing:.03em; border:2px solid transparent; transition:color .2s,background .2s,border-color .2s,box-shadow .2s; text-decoration:none; white-space:nowrap; cursor:pointer; }
.btn--sm { height:36px; padding:0 14px; font-size:12px; }
.btn--lg { height:52px; padding:0 32px; font-size:16px; }
.btn--full { width:100%; }
.btn--p { background:var(--c-p500); color:var(--txi); border:none; box-shadow:var(--sh-sm); }
.btn--p:hover { background:var(--c-p600); box-shadow:var(--sh-md); color:var(--txi); }
.btn--s { background:transparent; color:var(--c-p500); border-color:var(--c-p500); }
.btn--s:hover { background:var(--c-p50); border-color:var(--c-p600); color:var(--c-p600); }
.btn--g { background:transparent; color:var(--c-p500); border-color:transparent; }
.btn--g:hover { background:var(--c-p50); color:var(--c-p600); }
.btn--a { background:var(--c-a500); color:var(--c-n900); border:none; box-shadow:var(--sh-sm); }
.btn--a:hover { background:var(--c-a600); box-shadow:var(--sh-md); color:var(--c-n900); }
.btn--dis,.btn:disabled { opacity:.45; cursor:not-allowed; pointer-events:none; }
.spin { display:inline-block; width:14px; height:14px; border:2px solid currentColor; border-top-color:transparent; border-radius:50%; animation:spin .6s linear infinite; }

/* ============================================
   BREADCRUMB (GLOBAL)
   ============================================ */
/* Default: match shop/product pages (1400px) */
.g-bc { font-size:12px; color:var(--txm); width:100%; max-width:1400px; margin:0 auto; padding:14px 32px 0; }
/* Cart, checkout, account use 1200px content width */
.woocommerce-cart .g-bc,
.woocommerce-checkout .g-bc,
.woocommerce-account .g-bc { max-width:1200px; padding-left:32px; padding-right:32px; }
.g-bc a { color:var(--tx2); transition:color .15s; }
.g-bc a:hover { color:var(--c-p500); }
.g-bc-sep { margin:0 5px; color:var(--c-n300); }

/* ============================================
   BADGES
   ============================================ */
.badge { display:inline-flex; align-items:center; gap:4px; height:22px; padding:0 8px; border-radius:var(--r-full); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; line-height:1; white-space:nowrap; border:1px solid currentColor; border-color:color-mix(in srgb, currentColor 25%, transparent); }
.b-sale { background:var(--c-sale-bg); color:var(--c-sale); }
.b-new { background:var(--c-p100); color:var(--c-p500); }
.b-best { background:var(--c-a-lt); color:var(--c-a600); }
.b-lab { background:var(--c-info-lt); color:var(--c-info-base); }
.b-trust { background:var(--c-ok-lt); color:var(--c-ok-base); }
.b-ship { background:var(--c-warn-lt); color:var(--c-warn-dk); }
.b-feat { background:var(--c-p50); color:var(--c-p500); }

/* ============================================
   INPUTS
   ============================================ */
.ig { display:flex; flex-direction:column; gap:6px; }
.il { font-size:12px; font-weight:600; color:var(--tx2); text-transform:uppercase; letter-spacing:.05em; }
.inp { height:44px; padding:0 14px; border:1.5px solid var(--bdr); border-radius:var(--r-sm); font-family:var(--fb); font-size:14px; color:var(--tx); background:var(--bg); outline:none; transition:border-color .2s,box-shadow .2s; }
.inp:focus { border-color:var(--bdrf); box-shadow:var(--sh-f); }
.ihelp { font-size:12px; color:var(--txm); margin-top:2px; }
.ierr { font-size:12px; color:var(--c-err-base); margin-top:2px; }

/* ============================================
   NOTICES
   ============================================ */
.notice { padding:12px 16px; border-radius:var(--r-sm); font-size:14px; display:flex; align-items:center; gap:10px; }
.n-info { background:var(--c-info-lt); color:var(--c-info-dk); border-left:4px solid var(--c-info-base); }
.n-ok { background:var(--c-ok-lt); color:var(--c-ok-dk); border-left:4px solid var(--c-ok-base); }
.n-warn { background:var(--c-warn-lt); color:var(--c-warn-dk); border-left:4px solid var(--c-warn-base); }
.n-err { background:var(--c-err-lt); color:var(--c-err-dk); border-left:4px solid var(--c-err-base); }

/* ============================================
   STARS
   ============================================ */
.stars { display:inline-flex; align-items:center; gap:2px; }
.sf { color:var(--c-star); }
.se { color:var(--c-n200); }
.sc { font-size:12px; color:var(--txm); margin-left:6px; }

/* ============================================
   TOASTS
   ============================================ */
.toast { position:fixed; bottom:24px; right:24px; z-index:1100; min-width:280px; max-width:400px; padding:14px 18px; border-radius:var(--r-md); box-shadow:var(--sh-lg); font-size:14px; display:flex; align-items:center; gap:10px; transform:translateY(120%); transition:transform .3s cubic-bezier(.25,.1,.25,1),opacity .3s; opacity:0; }
.toast.is-visible { transform:translateY(0); opacity:1; }
.t-ok { background:var(--c-ok-lt); color:var(--c-ok-dk); border:1px solid var(--c-ok-bdr); }
.t-err { background:var(--c-err-lt); color:var(--c-err-dk); border:1px solid var(--c-err-bdr); }
.t-inf { background:var(--c-info-lt); color:var(--c-info-dk); border:1px solid var(--c-info-bdr); }

/* ============================================
   SECTION HEADER
   ============================================ */
.sec-hdr { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:28px; }
.sec-over { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--c-a700); margin-bottom:8px; display:flex; align-items:center; gap:10px; }
.sec-over--dk { color:var(--c-a500); }
.sec-title { font-family:var(--fd); font-size:clamp(26px,3.5vw,38px); font-weight:400; line-height:1.15; letter-spacing:-.02em; color:var(--tx); }
.sec-title--inv { color:var(--txi); }
.sec-title em { color:var(--c-p500); font-style:italic; }
.sec-title--inv em { color:var(--c-a400); }
.sec-link { font-size:13px; font-weight:600; color:var(--c-p500); display:inline-flex; align-items:center; gap:6px; white-space:nowrap; transition:color .15s; }
.sec-link:hover { color:var(--c-p600); }
.sec-link--inv { color:var(--c-a400); }
.sec-link--inv:hover { color:var(--c-a500); }

/* ============================================
   SKELETONS
   ============================================ */
.sk { background:var(--c-n100); border-radius:var(--r-sm); animation:pulse 1.5s ease-in-out infinite; }
.sk-tx { height:14px; width:80%; }
.sk-txs { height:12px; width:60%; }
.sk-hd { height:24px; width:50%; }
.sk-img { aspect-ratio:1; border-radius:var(--r-lg); }
.sk-bdg { height:22px; width:60px; border-radius:var(--r-sm); }
.sk-btn { height:44px; width:120px; border-radius:var(--r-sm); }

/* ============================================
   QUANTITY STEPPER
   ============================================ */
.qty { display:inline-flex; align-items:center; border:1.5px solid var(--bdr); border-radius:var(--r-sm); overflow:hidden; }
.qty button { width:40px; min-height:44px; background:none; border:none; font-size:16px; cursor:pointer; color:var(--tx2); display:flex; align-items:center; justify-content:center; font-family:var(--fb); transition:background .15s,color .15s; }
.qty button:hover { background:var(--bg-el); color:var(--c-p500); }
.qty input { width:36px; height:30px; text-align:center; border:none; border-left:1.5px solid var(--bdr); border-right:1.5px solid var(--bdr); font-size:13px; font-weight:700; font-family:var(--fb); background:none; color:var(--tx); outline:none; -moz-appearance:textfield; }
.qty input::-webkit-inner-spin-button,
.qty input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }

/* ============================================
   PAGINATION
   ============================================ */
.pag { display:flex; align-items:center; justify-content:center; gap:6px; padding:24px 0; }
.pi { width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:var(--r-sm); font-size:13px; font-weight:600; color:var(--tx2); border:1px solid var(--bdr); background:var(--bg); cursor:pointer; transition:background .15s,color .15s,border-color .15s; text-decoration:none; }
.pi:hover { background:var(--bg-el); border-color:var(--c-n300); color:var(--tx); }
.pi.on { background:var(--c-p500); color:var(--txi); border-color:var(--c-p500); }
.pi.dis { opacity:.4; cursor:not-allowed; pointer-events:none; }

/* ============================================
   WOOCOMMERCE GLOBAL OVERRIDES
   ============================================ */

/* Page titles */
.woocommerce-products-header__title,
.page-title,
.entry-title {
  font-family: var(--fd);
  font-size: clamp(26px,3.5vw,38px);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -.02em;
}

/* WC notices */
.woocommerce-message {
  padding: 12px 16px;
  border-left: 4px solid var(--c-ok-base);
  border-radius: var(--r-sm);
  margin: 0 32px 16px;
  background: var(--c-ok-lt);
  color: var(--c-ok-dk);
  font-size: 14px;
}
.woocommerce-info {
  padding: 12px 16px;
  border-left: 4px solid var(--c-info-base);
  border-radius: var(--r-sm);
  margin: 0 32px 16px;
  background: var(--c-info-lt);
  color: var(--c-info-dk);
  font-size: 14px;
}
.woocommerce-error {
  padding: 12px 16px;
  border-left: 4px solid var(--c-err-base);
  border-radius: var(--r-sm);
  margin: 0 32px 16px;
  background: var(--c-err-lt);
  color: var(--c-err-dk);
  font-size: 14px;
  list-style: none;
}

/* WC buttons */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button.alt {
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  background: var(--c-p500);
  color: var(--txi);
  border: none;
  border-radius: var(--r-sm);
  font-size: 14px;
  font-weight: 600;
  font-family: var(--fb);
  letter-spacing: .03em;
  cursor: pointer;
  transition: background .2s, box-shadow .2s;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1;
  box-shadow: var(--sh-sm);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .button.alt:hover {
  background: var(--c-p600);
  box-shadow: var(--sh-md);
  color: var(--txi);
}

/* WC form inputs */
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce input[type="number"],
.woocommerce input[type="url"],
.woocommerce select,
.woocommerce textarea {
  height: 44px;
  border: 1.5px solid var(--bdr);
  border-radius: var(--r-sm);
  padding: 0 14px;
  font-family: var(--fb);
  font-size: 14px;
  color: var(--tx);
  background: var(--bg);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.woocommerce textarea { height: auto; padding: 12px 14px; }
.woocommerce input[type="text"]:focus,
.woocommerce input[type="email"]:focus,
.woocommerce input[type="tel"]:focus,
.woocommerce input[type="password"]:focus,
.woocommerce input[type="number"]:focus,
.woocommerce input[type="url"]:focus,
.woocommerce select:focus,
.woocommerce textarea:focus {
  border-color: var(--bdrf);
  box-shadow: var(--sh-f);
}

/* WC tables */
.woocommerce table.shop_table {
  border-collapse: collapse;
  width: 100%;
}
.woocommerce table.shop_table th {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--txm);
  padding: 12px 16px;
}
.woocommerce table.shop_table td {
  padding: 16px;
  border-bottom: 1px solid var(--bdr);
}

/* WC pagination — mirrors .pag/.pi */
.woocommerce nav.woocommerce-pagination {
  text-align: center;
  padding: 24px 0;
}
.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
}
.woocommerce nav.woocommerce-pagination ul li {
  border: none;
  margin: 0;
  padding: 0;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 600;
  color: var(--tx2);
  border: 1px solid var(--bdr);
  background: var(--bg);
  text-decoration: none;
  transition: background .15s, color .15s, border-color .15s;
}
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--bg-el);
  border-color: var(--c-n300);
  color: var(--tx);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--c-p500);
  color: var(--txi);
  border-color: var(--c-p500);
}