/* ============================================================================
   AVISECO SYSTEMS — Design Tokens
   v1.0 · Sursa culorilor: logo Aviseco (navy #003366, sky #95CFF1)
   Nu modifica valorile fara sa actualizezi references/01-tokens.md.
   ============================================================================ */

:root {
  /* ---------- NAVY (primar) ---------- */
  --avs-navy-50:  #F0F5FA;
  --avs-navy-100: #DCE8F3;
  --avs-navy-200: #B9D0E6;
  --avs-navy-300: #8DB2D6;
  --avs-navy-400: #5C8CBF;
  --avs-navy-500: #2E63A0;
  --avs-navy-600: #124D85;
  --avs-navy-700: #003366;   /* culoarea de brand */
  --avs-navy-800: #002851;
  --avs-navy-900: #001A36;
  --avs-navy-950: #0D1B2A;

  /* ---------- SKY (secundar) ---------- */
  --avs-sky-50:  #F2FAFE;
  --avs-sky-100: #DFF1FC;
  --avs-sky-200: #C4E5F8;
  --avs-sky-300: #95CFF1;    /* accentul de brand */
  --avs-sky-400: #6BB8E6;
  --avs-sky-500: #3D9AD1;
  --avs-sky-600: #2079AF;
  --avs-sky-700: #175F8B;

  /* ---------- INK (text si structura) ---------- */
  --avs-ink-900: #0B1622;
  --avs-ink-700: #33475B;
  --avs-ink-500: #5A6B7D;
  --avs-ink-300: #8A99A8;
  --avs-ink-200: #C9D3DC;
  --avs-ink-100: #E4EAF0;
  --avs-ink-50:  #F5F7FA;
  --avs-white:   #FFFFFF;

  /* ---------- SEMANTICE ---------- */
  --avs-success:     #12734A;
  --avs-success-bg:  #E6F4EE;
  --avs-warning:     #8A5300;
  --avs-warning-bg:  #FDF3E2;
  --avs-danger:      #B3261E;
  --avs-danger-bg:   #FCEDEC;
  --avs-info:        #124D85;
  --avs-info-bg:     #E8F1F9;

  /* ---------- CATEGORICE: cele 9 domenii tehnice ---------- */
  --avs-cat-gpon:   #003366;
  --avs-cat-bms:    #2079AF;
  --avs-cat-tvcc:   #12734A;
  --avs-cat-evac:   #8A5300;
  --avs-cat-fire:   #B3261E;
  --avs-cat-room:   #6B4EA8;
  --avs-cat-access: #00707A;
  --avs-cat-av:     #A03E7A;
  --avs-cat-lights: #4A5A9E;

  /* ---------- ROLURI SEMANTICE (tema light) ----------
     Componentele consuma DOAR aceste variabile, nu scarile de mai sus.
     Asa tema dark se schimba intr-un singur loc.                        */
  --avs-bg-app:        var(--avs-ink-50);
  --avs-bg-surface:    var(--avs-white);
  --avs-bg-raised:     var(--avs-white);
  --avs-bg-subtle:     var(--avs-navy-50);
  --avs-bg-inverse:    var(--avs-navy-700);

  --avs-text-primary:   var(--avs-ink-900);
  --avs-text-secondary: var(--avs-ink-700);
  --avs-text-tertiary:  var(--avs-ink-500);
  --avs-text-disabled:  var(--avs-ink-300);
  --avs-text-inverse:   var(--avs-white);
  --avs-text-link:      var(--avs-navy-600);
  --avs-text-accent:    var(--avs-sky-700);

  --avs-border:        var(--avs-ink-100);
  --avs-border-strong: var(--avs-ink-200);
  --avs-border-focus:  var(--avs-sky-400);

  --avs-action:         var(--avs-navy-700);
  --avs-action-hover:   var(--avs-navy-600);
  --avs-action-active:  var(--avs-navy-800);
  --avs-action-text:    var(--avs-white);

  /* ---------- TIPOGRAFIE ---------- */
  --avs-font-sans: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
  --avs-font-mono: "JetBrains Mono", "Consolas", ui-monospace, "Courier New", monospace;

  --avs-text-xs:   12px;  --avs-lh-xs:   16px;
  --avs-text-sm:   13px;  --avs-lh-sm:   20px;
  --avs-text-base: 14px;  --avs-lh-base: 22px;
  --avs-text-md:   16px;  --avs-lh-md:   24px;
  --avs-text-lg:   18px;  --avs-lh-lg:   26px;
  --avs-text-xl:   20px;  --avs-lh-xl:   28px;
  --avs-text-2xl:  24px;  --avs-lh-2xl:  32px;
  --avs-text-3xl:  30px;  --avs-lh-3xl:  38px;
  --avs-text-4xl:  36px;  --avs-lh-4xl:  44px;

  --avs-weight-regular:  400;
  --avs-weight-medium:   500;
  --avs-weight-semibold: 600;
  --avs-weight-bold:     700;

  /* ---------- SPATIERE (scara de 4px) ---------- */
  --avs-space-1:  4px;
  --avs-space-2:  8px;
  --avs-space-3:  12px;
  --avs-space-4:  16px;
  --avs-space-5:  20px;
  --avs-space-6:  24px;
  --avs-space-8:  32px;
  --avs-space-10: 40px;
  --avs-space-12: 48px;
  --avs-space-16: 64px;

  /* ---------- RAZE ---------- */
  --avs-radius-sm:   4px;
  --avs-radius-md:   8px;
  --avs-radius-lg:   12px;
  --avs-radius-full: 999px;

  /* ---------- UMBRE (tentate navy, nu negru) ---------- */
  --avs-shadow-sm: 0 1px 2px rgba(0, 26, 54, .06);
  --avs-shadow-md: 0 4px 12px rgba(0, 26, 54, .10);
  --avs-shadow-lg: 0 12px 32px rgba(0, 26, 54, .16);

  /* ---------- MISCARE ---------- */
  --avs-motion-fast: 120ms;
  --avs-motion-base: 180ms;
  --avs-motion-slow: 240ms;
  --avs-ease: cubic-bezier(.2, 0, .2, 1);

  /* ---------- STRATURI ---------- */
  --avs-z-base: 0;
  --avs-z-sticky: 50;
  --avs-z-dropdown: 100;
  --avs-z-modal: 200;
  --avs-z-toast: 300;

  /* ---------- DENSITATE (implicit: comfortable) ---------- */
  --avs-row-padding-y: 12px;
  --avs-row-padding-x: 16px;
  --avs-control-height: 36px;
}

/* Densitate compacta — pe containere cu multe randuri (liste de echipamente,
   pozitii de oferta, jurnale). Se pune pe tabel sau pe sectiune, nu pe <body>. */
[data-density="compact"] {
  --avs-row-padding-y: 8px;
  --avs-row-padding-x: 12px;
  --avs-control-height: 30px;
}

/* ============================================================================
   TEMA DARK — se activeaza cu <html data-theme="dark">
   Doar rolurile semantice se redefinesc; scarile raman intacte.
   ============================================================================ */
[data-theme="dark"] {
  --avs-bg-app:     var(--avs-navy-950);
  --avs-bg-surface: #12253A;
  --avs-bg-raised:  #18304A;
  --avs-bg-subtle:  #0A1522;
  --avs-bg-inverse: var(--avs-sky-300);

  --avs-text-primary:   #EAF1F8;
  --avs-text-secondary: #B7C6D6;
  --avs-text-tertiary:  #8A99A8;
  --avs-text-disabled:  #5A6B7D;
  --avs-text-inverse:   var(--avs-navy-900);
  --avs-text-link:      var(--avs-sky-300);
  --avs-text-accent:    var(--avs-sky-300);

  --avs-border:        #22405E;
  --avs-border-strong: #2F5478;
  --avs-border-focus:  var(--avs-sky-400);

  --avs-action:        var(--avs-sky-400);
  --avs-action-hover:  var(--avs-sky-300);
  --avs-action-active: var(--avs-sky-500);
  --avs-action-text:   var(--avs-navy-900);

  --avs-success:    #7FD1A8;  --avs-success-bg: #102E22;
  --avs-warning:    #F0B357;  --avs-warning-bg: #33240B;
  --avs-danger:     #F58B84;  --avs-danger-bg:  #3A1512;
  --avs-info:       #A9C4E8;  --avs-info-bg:    #12253A;

  --avs-cat-gpon:   #A9C4E8;
  --avs-cat-bms:    #6BB8E6;
  --avs-cat-tvcc:   #7FD1A8;
  --avs-cat-evac:   #F0B357;
  --avs-cat-fire:   #F58B84;
  --avs-cat-room:   #B79CE8;
  --avs-cat-access: #5FC9CE;
  --avs-cat-av:     #E58FBE;
  --avs-cat-lights: #96A6E0;

  --avs-shadow-sm: 0 1px 2px rgba(0, 0, 0, .40);
  --avs-shadow-md: 0 4px 12px rgba(0, 0, 0, .50);
  --avs-shadow-lg: 0 12px 32px rgba(0, 0, 0, .60);
}

/* Respecta preferinta sistemului daca aplicatia nu forteaza o tema. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    color-scheme: dark;
  }
}

/* Accesibilitate: nimeni nu primeste animatii daca a cerut sa nu primeasca. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --avs-motion-fast: 1ms;
    --avs-motion-base: 1ms;
    --avs-motion-slow: 1ms;
  }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}
