/* VoltCore — semantic aliases. Components read ONLY these, never the base palette.
   Both themes are WCAG 2.1 AA; measured ratios are in the comments and in
   guidelines/contrast.card.html. */

:root, [data-theme="dark"] {
  color-scheme: dark;
  --surface-page:      var(--vc-navy-950);
  --surface-raised:    var(--vc-navy-800);
  --surface-sunken:    #01040F;
  --surface-hover:     var(--vc-navy-700);
  --surface-accent:    var(--vc-orange-500);
  --surface-inverse:   var(--vc-cream-50);

  --text-heading:      var(--vc-white);        /* 19.67:1 on page */
  --text-body:         #E4E5EA;               /* 16.4:1  on page */
  --text-muted:        var(--vc-gray-400);     /* 10.81:1 on page, 9.10:1 on raised */
  --text-accent:       var(--vc-orange-500);   /* 7.40:1  on page */
  --text-on-accent:    var(--vc-navy-950);     /* 7.40:1  on orange-500 */
  --text-inverse:      var(--vc-navy-950);
  --text-link:         var(--vc-orange-400);   /* 9.43:1  on page */
  --text-link-hover:   #FFB77F;

  --border-subtle:     rgba(255,255,255,.08);
  --border-default:    rgba(255,255,255,.14);
  --border-strong:     rgba(255,255,255,.26);
  --border-accent:     var(--vc-orange-500);

  --state-success:     var(--vc-success-on-dark);
  --state-warning:     var(--vc-warning-on-dark);
  --state-danger:      var(--vc-danger-on-dark);
  --state-info:        var(--vc-info-on-dark);
  --state-success-bg:  rgba(79,190,124,.12);
  --state-warning-bg:  rgba(242,189,74,.12);
  --state-danger-bg:   rgba(240,112,112,.12);
  --state-info-bg:     rgba(107,166,234,.12);

  --focus-ring:        var(--vc-orange-500);
  --watermark:         rgba(255,255,255,.05);  /* bolt / "V" watermark opacity on dark */
  --scrim:             var(--vc-gradient-scrim);
}

[data-theme="light"] {
  color-scheme: light;
  --surface-page:      var(--vc-cream-50);
  --surface-raised:    var(--vc-white);
  --surface-sunken:    var(--vc-gray-100);
  --surface-hover:     var(--vc-gray-100);
  --surface-accent:    var(--vc-orange-500);
  --surface-inverse:   var(--vc-navy-950);

  --text-heading:      var(--vc-navy-900);     /* 17.42:1 on page */
  --text-body:         #23283C;               /* 13.9:1  on page */
  --text-muted:        var(--vc-slate-500);    /* 5.80:1  on page */
  --text-accent:       var(--vc-orange-text);  /* 6.34:1 on page, >=5.56:1 on any state tint */
  --text-on-accent:    var(--vc-navy-950);     /* 7.40:1  on orange-500 */
  --text-inverse:      var(--vc-white);
  --text-link:         var(--vc-orange-text);  /* 6.34:1  on page */
  --text-link-hover:   #7E2E05;               /* 8.52:1  on page */

  --border-subtle:     var(--vc-gray-100);
  --border-default:    #DEDCD6;
  --border-strong:     var(--vc-gray-400);
  --border-accent:     var(--vc-orange-500);

  /* Each ink clears 4.5:1 on its own tint below — see tokens/colors.css. */
  --state-success:     var(--vc-success-on-light);
  --state-warning:     var(--vc-warning-on-light);
  --state-danger:      var(--vc-danger-on-light);
  --state-info:        var(--vc-info-on-light);
  --state-success-bg:  rgba(31,122,69,.08);
  --state-warning-bg:  rgba(138,98,7,.10);
  --state-danger-bg:   rgba(179,48,47,.08);
  --state-info-bg:     rgba(33,95,168,.08);

  --focus-ring:        var(--vc-orange-500);
  --watermark:         rgba(4,15,47,.06);
  --scrim:             var(--vc-gradient-scrim);
}