/* YunaGRP V6.7.4 — Final Theme & Production Sweep
   Loaded LAST to keep all seasonal themes visually consistent. */

/* ---------- Theme Studio ---------- */
html[data-theme="dark"] .theme-skin-option.is-selected{
  border-color:var(--purple)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--purple) 28%,transparent),0 14px 34px rgba(0,0,0,.24)!important;
}

/* ---------- Shared dark surface tokens ---------- */
html[data-theme="dark"] body.store-page{
  --claim-surface:#201824;
  --claim-surface-2:#18121d;
  --claim-line:#53405f;
  --claim-text:#fff7ff;
  --claim-muted:#c4b4ca;
}
html[data-theme="dark"][data-skin]:not([data-skin="default"]) body.store-page{
  --claim-surface:var(--season-panel);
  --claim-surface-2:var(--season-panel-2);
  --claim-line:var(--season-line);
  --claim-text:var(--season-text);
  --claim-muted:var(--season-muted);
}

/* Claim / checkout / coupon components introduced after the theme engine
   must inherit the active seasonal palette instead of falling back to
   the generic purple dark palette. */
html[data-theme="dark"] body.store-page .claim-account-card,
html[data-theme="dark"] body.store-page .claim-confirm-box,
html[data-theme="dark"] body.store-page .claim-quantity-box,
html[data-theme="dark"] body.store-page .coupon-apply-box{
  background:linear-gradient(145deg,var(--claim-surface),var(--claim-surface-2))!important;
  border-color:var(--claim-line)!important;
  color:var(--claim-text)!important;
  box-shadow:0 14px 32px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html[data-theme="dark"] body.store-page .claim-account-title,
html[data-theme="dark"] body.store-page .claim-account-title span,
html[data-theme="dark"] body.store-page .claim-account-title small,
html[data-theme="dark"] body.store-page .claim-confirm-box h3,
html[data-theme="dark"] body.store-page .claim-quantity-head strong,
html[data-theme="dark"] body.store-page .coupon-apply-head strong{
  color:var(--claim-text)!important;
}
html[data-theme="dark"] body.store-page .claim-confirm-box p,
html[data-theme="dark"] body.store-page .claim-quantity-head small,
html[data-theme="dark"] body.store-page .coupon-apply-head small{
  color:var(--claim-muted)!important;
}
html[data-theme="dark"] body.store-page .claim-preview>div,
html[data-theme="dark"] body.store-page .claim-preview.secure-preview>div,
html[data-theme="dark"] body.store-page .otp-account-repeat>div,
html[data-theme="dark"] body.store-page .coupon-success-summary>div,
html[data-theme="dark"] body.store-page .checkout-summary>div{
  background:color-mix(in srgb,var(--claim-surface) 88%,#000)!important;
  border-color:var(--claim-line)!important;
  color:var(--claim-text)!important;
}
html[data-theme="dark"] body.store-page .claim-preview span,
html[data-theme="dark"] body.store-page .otp-account-repeat span,
html[data-theme="dark"] body.store-page .coupon-success-summary span,
html[data-theme="dark"] body.store-page .checkout-summary span{
  color:var(--claim-muted)!important;
}
html[data-theme="dark"] body.store-page .claim-preview strong,
html[data-theme="dark"] body.store-page .claim-preview .copy-value,
html[data-theme="dark"] body.store-page .otp-account-repeat strong,
html[data-theme="dark"] body.store-page .coupon-success-summary strong,
html[data-theme="dark"] body.store-page .checkout-summary strong{
  color:var(--claim-text)!important;
}
html[data-theme="dark"] body.store-page .qty-btn,
html[data-theme="dark"] body.store-page .claim-price-live{
  background:color-mix(in srgb,var(--claim-surface) 86%,#000)!important;
  border-color:var(--claim-line)!important;
  color:var(--claim-text)!important;
}

/* OTP warning semantics remain amber/pink, but are dark in every skin. */
html[data-theme="dark"] body.store-page .otp-before-warning,
html[data-theme="dark"] body.store-page .otp-expiry-warning,
html[data-theme="dark"] body.store-page .strong-warning{
  background:linear-gradient(135deg,#302313,#2a1e1b)!important;
  border-color:#73512d!important;
  color:#ffe3a4!important;
}
html[data-theme="dark"] body.store-page .otp-before-warning strong{color:#ffe8b6!important}
html[data-theme="dark"] body.store-page .otp-before-warning span{color:#dfbd88!important}
html[data-theme="dark"] body.store-page .otp-last-warning{
  background:linear-gradient(135deg,#34202b,#2b1b27)!important;
  border-color:#704356!important;
  color:#f4c7d8!important;
}

/* Final OTP result inherits the seasonal panel while keeping OTP prominent. */
html[data-theme="dark"] body.store-page .otp-success-box,
html[data-theme="dark"] body.store-page .otp-combined-result{
  background:linear-gradient(145deg,var(--claim-surface),var(--claim-surface-2))!important;
  border-color:var(--claim-line)!important;
  color:var(--claim-text)!important;
}
html[data-theme="dark"] body.store-page .otp-code-panel{
  background:color-mix(in srgb,var(--claim-surface) 82%,#09101c)!important;
  border-color:var(--claim-line)!important;
}
html[data-theme="dark"] body.store-page .otp-code-panel>span{color:var(--claim-muted)!important}
html[data-theme="dark"] body.store-page .otp-code-panel .otp-code{
  color:color-mix(in srgb,var(--pink) 68%,#fff)!important;
  text-shadow:0 0 18px color-mix(in srgb,var(--pink) 18%,transparent)!important;
}

/* Light seasonal surfaces should also look like the selected skin. */
html[data-theme="light"][data-skin]:not([data-skin="default"]) body.store-page .claim-account-card,
html[data-theme="light"][data-skin]:not([data-skin="default"]) body.store-page .claim-confirm-box,
html[data-theme="light"][data-skin]:not([data-skin="default"]) body.store-page .claim-quantity-box,
html[data-theme="light"][data-skin]:not([data-skin="default"]) body.store-page .coupon-apply-box{
  border-color:color-mix(in srgb,var(--purple) 24%,var(--line))!important;
  box-shadow:0 14px 30px color-mix(in srgb,var(--purple) 8%,transparent)!important;
}

/* ---------- Mobile checkout / claim safety ---------- */
@media(max-width:760px){
  body.store-page .claim-page{display:block!important;width:100%!important;padding-inline:0!important}
  body.store-page .claim-shell,
  body.store-page .premium-claim-shell{width:100%!important;max-width:100%!important;padding:16px!important}
  body.store-page .claim-status-box.claim-four{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  body.store-page .claim-preview.secure-preview{grid-template-columns:1fr!important;gap:8px!important}
  body.store-page .claim-nav-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  body.store-page .claim-nav-actions .btn{width:100%!important;text-align:center!important}
  body.store-page .coupon-input-row{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}
  body.store-page .coupon-success-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.store-page .claim-quantity-control{width:100%!important;grid-template-columns:48px minmax(0,1fr) 48px!important}
}
@media(max-width:480px){
  body.store-page .claim-status-box.claim-four{grid-template-columns:1fr!important}
  body.store-page .claim-nav-actions{grid-template-columns:1fr!important}
  body.store-page .coupon-input-row{grid-template-columns:1fr!important}
  body.store-page .coupon-input-row .btn{width:100%!important}
  body.store-page .coupon-success-summary{grid-template-columns:1fr!important}
  body.store-page .otp-code-panel .otp-code{font-size:24px!important;letter-spacing:.09em!important;overflow-wrap:anywhere!important}
}

/* ---------- Accessibility / production UX ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
.theme-skin-option:focus-within{
  outline:3px solid color-mix(in srgb,var(--purple) 55%,#fff)!important;
  outline-offset:2px!important;
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}