/* GOLDEN Stock — Material 3 Design Tokens
   Palette: Deep Red (Golden brand) + Gold + Jade + Gemini Accent
   Both light & dark themes */

:root {
  /* ===== Reference palette ===== */
  --gold-10: #2A1700;
  --gold-20: #432C00;
  --gold-30: #614200;
  --gold-40: #815900;
  --gold-50: #A37300;
  --gold-60: #C18B17;
  --gold-70: #D4A437;
  --gold-80: #EEC25A;
  --gold-90: #FFDF94;
  --gold-95: #FFEFCF;
  --gold-99: #FFFBF1;

  --red-10: #410001;
  --red-20: #680003;
  --red-30: #930006;
  --red-40: #B3261E;
  --red-50: #DC362E;
  --red-60: #E46962;
  --red-70: #EC928E;
  --red-80: #F2B8B5;
  --red-90: #F9DEDC;
  --red-95: #FCEEEE;
  --red-99: #FFFBFF;

  --jade-30: #00513A;
  --jade-40: #1F8A5B;
  --jade-50: #36A06F;
  --jade-80: #A5D6BC;
  --jade-90: #C8EAD7;

  --amber-50: #F9AB00;
  --amber-90: #FFE7A8;

  --neutral-0:  #000000;
  --neutral-5:  #0E0E11;
  --neutral-10: #1B1B1F;
  --neutral-15: #25252A;
  --neutral-20: #303034;
  --neutral-25: #3A3A3F;
  --neutral-30: #46464B;
  --neutral-40: #5E5E64;
  --neutral-50: #77777D;
  --neutral-60: #919197;
  --neutral-70: #ABABB2;
  --neutral-80: #C7C7CE;
  --neutral-90: #E3E2EA;
  --neutral-94: #EFEEF6;
  --neutral-95: #F2F1F9;
  --neutral-98: #FAF9FF;
  --neutral-99: #FFFBFF;
  --neutral-100:#FFFFFF;

  /* ===== Gemini gradient stops (for AI accents) ===== */
  --gemini-1: #4285F4;
  --gemini-2: #9B72CB;
  --gemini-3: #D96570;
  --gemini-4: #F9AB00;
  --gemini-gradient: linear-gradient(135deg, #4285F4 0%, #9B72CB 38%, #D96570 70%, #F9AB00 100%);
  --gemini-gradient-soft: linear-gradient(135deg,
    color-mix(in oklab, #4285F4 22%, transparent) 0%,
    color-mix(in oklab, #9B72CB 22%, transparent) 38%,
    color-mix(in oklab, #D96570 22%, transparent) 70%,
    color-mix(in oklab, #F9AB00 22%, transparent) 100%);

  /* ===== Semantic — LIGHT ===== */
  --md-primary:           var(--red-40);
  --md-on-primary:        #FFFFFF;
  --md-primary-container: var(--red-90);
  --md-on-primary-container: var(--red-10);

  --md-secondary:           var(--gold-50);
  --md-on-secondary:        #FFFFFF;
  --md-secondary-container: var(--gold-90);
  --md-on-secondary-container: var(--gold-10);

  --md-tertiary:           var(--jade-40);
  --md-on-tertiary:        #FFFFFF;
  --md-tertiary-container: var(--jade-90);
  --md-on-tertiary-container: var(--jade-30);

  --md-error:           #B3261E;
  --md-on-error:        #FFFFFF;
  --md-error-container: #F9DEDC;
  --md-on-error-container: #410E0B;

  --md-background:      #FFFBF8;
  --md-on-background:   var(--neutral-10);
  --md-surface:         #FFFBF8;
  --md-on-surface:      var(--neutral-10);
  --md-surface-variant: #F4E9DB;
  --md-on-surface-variant: #52443A;

  --md-surface-dim:        #E8D9C6;
  --md-surface-bright:     #FFFBF8;
  --md-surface-container-lowest: #FFFFFF;
  --md-surface-container-low:    #FFF3E5;
  --md-surface-container:        #FBECD9;
  --md-surface-container-high:   #F5E5D0;
  --md-surface-container-highest:#EFDFC8;

  --md-outline:         #847468;
  --md-outline-variant: #D6C3B2;
  --md-scrim:           #000000;
  --md-shadow:          #000000;

  --md-inverse-surface: var(--neutral-20);
  --md-inverse-on-surface: var(--neutral-95);
  --md-inverse-primary: #FFB3AE;

  /* ===== Shape ===== */
  --shape-xs:  4px;
  --shape-sm:  8px;
  --shape-md:  12px;
  --shape-lg:  16px;
  --shape-xl:  28px;
  --shape-2xl: 36px;
  --shape-full: 999px;

  /* ===== Elevation (M3) ===== */
  --elev-0: none;
  --elev-1: 0 1px 2px rgba(0,0,0,.30), 0 1px 3px 1px rgba(0,0,0,.15);
  --elev-2: 0 1px 2px rgba(0,0,0,.30), 0 2px 6px 2px rgba(0,0,0,.15);
  --elev-3: 0 1px 3px rgba(0,0,0,.30), 0 4px 8px 3px rgba(0,0,0,.15);
  --elev-4: 0 2px 3px rgba(0,0,0,.30), 0 6px 10px 4px rgba(0,0,0,.15);
  --elev-5: 0 4px 4px rgba(0,0,0,.30), 0 8px 12px 6px rgba(0,0,0,.15);

  /* ===== Motion ===== */
  --ease-emph:        cubic-bezier(0.2, 0, 0, 1);
  --ease-emph-accel:  cubic-bezier(0.3, 0, 0.8, 0.15);
  --ease-emph-decel:  cubic-bezier(0.05, 0.7, 0.1, 1);
  --ease-standard:    cubic-bezier(0.2, 0, 0, 1);
  --ease-spring:      cubic-bezier(0.34, 1.56, 0.64, 1);

  --dur-1: 100ms;
  --dur-2: 200ms;
  --dur-3: 300ms;
  --dur-4: 400ms;
  --dur-5: 500ms;
  --dur-6: 700ms;

  /* ===== Typography ===== */
  --font-display: "Google Sans", "Roboto Flex", "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:    "Roboto Flex", "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "Roboto Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale (M3) */
  --tdl-l: 57px/64px var(--font-display);   /* display-large */
  --tdl-m: 45px/52px var(--font-display);
  --tdl-s: 36px/44px var(--font-display);
  --thl-l: 32px/40px var(--font-display);   /* headline */
  --thl-m: 28px/36px var(--font-display);
  --thl-s: 24px/32px var(--font-display);
  --ttl-l: 22px/28px var(--font-display);   /* title */
  --ttl-m: 16px/24px var(--font-body);
  --ttl-s: 14px/20px var(--font-body);
  --tbd-l: 16px/24px var(--font-body);      /* body */
  --tbd-m: 14px/20px var(--font-body);
  --tbd-s: 12px/16px var(--font-body);
  --tlb-l: 14px/20px var(--font-body);      /* label */
  --tlb-m: 12px/16px var(--font-body);
  --tlb-s: 11px/16px var(--font-body);

  /* ===== Status (stock state) ===== */
  --status-ok:       var(--jade-40);
  --status-low:      #E6921A;
  --status-empty:    var(--red-40);
  --status-inactive: var(--neutral-60);
}

[data-theme="dark"] {
  --md-primary:           #FFB3AE;
  --md-on-primary:        var(--red-20);
  --md-primary-container: var(--red-30);
  --md-on-primary-container: var(--red-90);

  --md-secondary:           var(--gold-80);
  --md-on-secondary:        var(--gold-20);
  --md-secondary-container: var(--gold-30);
  --md-on-secondary-container: var(--gold-90);

  --md-tertiary:           var(--jade-80);
  --md-on-tertiary:        var(--jade-30);
  --md-tertiary-container: var(--jade-30);
  --md-on-tertiary-container: var(--jade-90);

  --md-error:           #F2B8B5;
  --md-on-error:        #601410;
  --md-error-container: #8C1D18;
  --md-on-error-container: #F9DEDC;

  --md-background:      #14110E;
  --md-on-background:   var(--neutral-90);
  --md-surface:         #14110E;
  --md-on-surface:      var(--neutral-90);
  --md-surface-variant: #52443A;
  --md-on-surface-variant: #D6C3B2;

  --md-surface-dim:        #14110E;
  --md-surface-bright:     #3B342D;
  --md-surface-container-lowest: #0E0B08;
  --md-surface-container-low:    #1D1915;
  --md-surface-container:        #211D18;
  --md-surface-container-high:   #2C2722;
  --md-surface-container-highest:#37312C;

  --md-outline:         #9F8C7E;
  --md-outline-variant: #52443A;

  --md-inverse-surface: var(--neutral-90);
  --md-inverse-on-surface: var(--neutral-20);
  --md-inverse-primary: var(--red-40);

  --status-low: #FFB55E;
}

/* Respect OS preference if no explicit theme set */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
  }
}