/* Valori POS — color tokens
   Base palette: near-black canvas #080D16 (canvas) · mint #30D882 (voltage) ·
   violet #7F67FF (secondary accent).
   Philosophy: "uma única voltagem" — the mint carries every primary action and
   every "approved" moment; the violet is a sparing secondary highlight.
   White-label: only --it-lime (primary) and --it-blue (accent) are overridden
   at runtime by the company branding; every other surface/text token stays fixed.

   NOTE: variable NAMES are kept stable (--it-lime, --gray-900, --blue-300…) so
   existing markup keeps resolving — only the VALUES were retuned to Valori POS. */

:root {
  /* ---- Brand base ---- */
  --it-ink: #0A121F;     /* on-primary deep ink — text/icon over mint */
  --it-lime: #30D882;    /* MINT — single voltage; every primary action + "approved" */
  --it-blue: #7F67FF;    /* VIOLET — secondary accent + info */
  --it-white: #FFFFFF;

  /* Mint ramp (primary — the one voltage of the system) */
  --lime-100: #C9F7DC;
  --lime-200: #5EFB8D;   /* primary-glow — brilho/gradiente, press on dark */
  --lime-300: #30D882;   /* brand / primary */
  --lime-400: #22A765;   /* primary-dark — press on light */
  --lime-500: #1B8F54;
  --lime-700: #12713F;   /* mint as text/stroke on light surfaces (>=3:1) */

  /* Violet ramp (secondary accent / info) */
  --blue-50:  #EEEAFF;
  --blue-100: #DCD4FF;
  --blue-300: #9A86FF;   /* lighter violet — legible accent/link on dark */
  --blue-500: #7F67FF;   /* accent / brand */
  --blue-600: #6A4FE8;
  --blue-700: #5840C4;

  /* Neutral ramp (cool blue-grafite, canvas-anchored) */
  --gray-0:   #FFFFFF;
  --gray-25:  #F8FAFC;
  --gray-50:  #F1F4FA;   /* light input */
  --gray-100: #EDF1F7;   /* light muted */
  --gray-200: #E6EBF3;   /* light surface-variant / sunken */
  --gray-300: #D7DEE9;   /* light border */
  --gray-400: #9199A5;   /* dark text-secondary */
  --gray-500: #6E7686;   /* dark text-tertiary / disabled */
  --gray-600: #5A6474;   /* light text-secondary */
  --gray-700: #252E3D;   /* dark border-default / muted bar */
  --gray-800: #1D293D;   /* dark surface-variant */
  --gray-850: #192230;   /* dark muted / sunken */
  --gray-900: #121824;   /* dark surface/card; dark ink for light text + on-mint */
  --gray-950: #080D16;   /* dark page canvas */

  /* Semantic status — solid + light tint */
  --green-500: #12A150;  /* success darkened for light */
  --green-100: #DCF7E9;
  --amber-500: #C2710C;  /* warning darkened for light */
  --amber-100: #FFF1D6;
  --red-500:  #DC2626;   /* danger darkened for light */
  --red-100:  #FEE2E3;

  /* Data-viz series (in order; chart-1 is the primary series) */
  --chart-1: #30D882;
  --chart-2: #7F67FF;
  --chart-3: #14B8A6;
  --chart-4: #FFB113;
  --chart-5: #4D9FFF;
  --chart-6: #9199A5;

  /* ---- Semantic aliases — light ---- */
  --surface-page:    #EEF1F7;
  --surface-card:    var(--gray-0);
  --surface-sunken:  var(--gray-200);
  --surface-raised:  var(--gray-0);
  --surface-inverse: var(--gray-900);
  --surface-accent:  var(--it-lime);

  --text-primary:    #0E1726;
  --text-secondary:  var(--gray-600);
  --text-tertiary:   #8A94A4;
  --text-on-inverse: #F3F5F9;
  --text-on-accent:  var(--it-ink);
  --text-link:       var(--blue-600);
  --text-positive:   var(--green-500);
  --text-negative:   var(--red-500);

  --border-subtle:   var(--gray-200);
  --border-default:  var(--gray-300);
  --border-strong:   #C2CBD9;

  --interactive:        var(--it-lime);    /* primary is ALWAYS mint (both modes) */
  --interactive-hover:  var(--lime-400);   /* press darkens on light */
  --accent:             var(--it-blue);    /* violet secondary highlight */
  --accent-hover:       var(--blue-600);
  --accent-graphic:     var(--lime-700);   /* mint stroke giving >=3:1 on light */
  --accent-edge:        var(--lime-700);   /* keyline for mint fills on light */
  --accent-contrast:    var(--it-ink);     /* text/icon on the mint button */
  --link:               var(--blue-600);
  --focus-ring:         rgba(48, 216, 130, 0.45);
  --selection:          rgba(48, 216, 130, 0.30);
}

/* ---- Dark theme ---- (default mode; same token names, retuned values) */
[data-theme="dark"] {
  --surface-page:    var(--gray-950);   /* #080D16 */
  --surface-card:    var(--gray-900);   /* #121824 */
  --surface-sunken:  var(--gray-850);   /* #192230 — recessed tiles/rows */
  --surface-raised:  var(--gray-800);   /* #1D293D — sheets/popovers */
  --surface-inverse: #F3F5F9;
  --surface-accent:  var(--it-lime);

  --text-primary:    #F3F5F9;
  --text-secondary:  var(--gray-400);   /* #9199A5 */
  --text-tertiary:   var(--gray-500);   /* #6E7686 */
  --text-on-inverse: var(--gray-900);
  --text-on-accent:  var(--it-ink);
  --text-link:       var(--blue-300);
  --text-positive:   #30D882;
  --text-negative:   #FD393F;

  --border-subtle:   var(--gray-850);   /* #192230 */
  --border-default:  var(--gray-700);   /* #252E3D */
  --border-strong:   #313C4E;

  --interactive:        var(--it-lime);   /* mint */
  --interactive-hover:  var(--lime-200);  /* brightens on dark */
  --accent:             var(--it-blue);
  --accent-hover:       var(--blue-300);
  --accent-graphic:     var(--it-lime);
  --accent-edge:        transparent;
  --accent-contrast:    var(--it-ink);
  --link:               var(--blue-300);
  --focus-ring:         rgba(48, 216, 130, 0.50);
  --selection:          rgba(48, 216, 130, 0.30);

  /* Semantic flips to the bright (dark-surface) variants */
  --green-500: #30D882;
  --amber-500: #FFB113;
  --red-500:   #FD393F;
}

/* ---- Explicit light scope ---- so a light island can nest inside a dark
   ancestor (e.g. a light preview on the dark canvas). */
[data-theme="light"] {
  --surface-page:    #EEF1F7;
  --surface-card:    var(--gray-0);
  --surface-sunken:  var(--gray-200);
  --surface-raised:  var(--gray-0);
  --surface-inverse: var(--gray-900);
  --surface-accent:  var(--it-lime);

  --text-primary:    #0E1726;
  --text-secondary:  var(--gray-600);
  --text-tertiary:   #8A94A4;
  --text-on-inverse: #F3F5F9;
  --text-on-accent:  var(--it-ink);
  --text-link:       var(--blue-600);
  --text-positive:   #12A150;
  --text-negative:   #DC2626;

  --border-subtle:   var(--gray-200);
  --border-default:  var(--gray-300);
  --border-strong:   #C2CBD9;

  --interactive:        var(--it-lime);
  --interactive-hover:  var(--lime-400);
  --accent:             var(--it-blue);
  --accent-hover:       var(--blue-600);
  --accent-graphic:     var(--lime-700);
  --accent-edge:        var(--lime-700);
  --accent-contrast:    var(--it-ink);
  --link:               var(--blue-600);
  --focus-ring:         rgba(48, 216, 130, 0.45);
  --selection:          rgba(48, 216, 130, 0.30);

  --green-500: #12A150;
  --amber-500: #C2710C;
  --red-500:   #DC2626;

  --shadow-xs: 0 1px 2px rgba(27, 42, 74, 0.05);
  --shadow-sm: 0 1px 3px rgba(27, 42, 74, 0.07), 0 1px 2px rgba(27, 42, 74, 0.04);
  --shadow-md: 0 4px 12px rgba(27, 42, 74, 0.08), 0 1px 3px rgba(27, 42, 74, 0.05);
  --shadow-lg: 0 12px 32px rgba(27, 42, 74, 0.12), 0 2px 6px rgba(27, 42, 74, 0.07);
}