/* ============================================================
   NORMASWATCH — Design Tokens (Identidade Grupo Graziano)
   ============================================================ */

/* ----------------------------------------------------------
   TEMA ESCURO (padrao)
---------------------------------------------------------- */
:root,
[data-theme="dark"] {

  --preto:      #0e0e0e;
  --preto-2:    #181818;
  --linha:      #2a2a2a;

  --marfim:     #f3efe7;
  --marfim-dim: #a39f97;

  --dourado:    #b89b5e;

  --ok:         #5a8f6e;
  --alerta:     #c99a3c;
  --critico:    #b5524f;

  /* Gradiente de fundo — escuro (glow superior sutil) */
  --bg-gradient: radial-gradient(120% 90% at 50% -10%, #1a1a20 0%, #121214 38%, #0d0d0f 100%);

  /* Card neumorfico — escuro (sombra dupla minimalista) */
  --card-bg:           #1c1c1c;
  --card-shadow:       10px 10px 24px rgb(6, 6, 6), -10px -10px 24px rgb(40, 40, 40);
  --card-shadow-hover: 6px 6px 16px rgb(6, 6, 6), -6px -6px 16px rgb(44, 44, 44);

  /* Botao neumorfico — escuro */
  --btn-bg:          #1c2333;
  --btn-bg-hover:    #1e2638;
  --btn-color:       #7a9cbd;
  --btn-color-hover: #9ab8d4;
  --btn-border:      rgba(255, 255, 255, 0.07);
  --btn-shadow-a:    rgba(255, 255, 255, 0.04) -4px -2px 12px 0px;
  --btn-shadow-b:    rgba(0, 0, 0, 0.6) 4px 2px 16px 0px;
  --btn-shadow-hover-a: rgba(255, 255, 255, 0.05) -2px -1px 8px 0px;
  --btn-shadow-hover-b: rgba(0, 0, 0, 0.45) 2px 1px 10px 0px;

  --btn-pri-bg:       #162540;
  --btn-pri-bg-hover: #1a2d4e;
  --btn-pri-color:    #a8cce8;
}

/* ----------------------------------------------------------
   TEMA CLARO — especificidade maior (html + atributo)
---------------------------------------------------------- */
html[data-theme="light"] {

  --preto:      #e2ddd6;
  --preto-2:    #d8d3cc;
  --linha:      #bfb9b1;

  --marfim:     #1a2535;
  --marfim-dim: #5a6a7a;

  --dourado:    #8a6e30;

  --ok:         #2a6644;
  --alerta:     #8a6010;
  --critico:    #8c2e2b;

  /* Gradiente de fundo — claro warm (glow superior sutil) */
  --bg-gradient: radial-gradient(120% 90% at 50% -10%, #efeae2 0%, #e6e1d9 40%, #ddd8d0 100%);

  /* Card neumorfico — claro warm gray */
  --card-bg:           #ddd8d0;
  --card-shadow:       10px 10px 24px rgb(172, 165, 157), -10px -10px 24px rgb(248, 243, 236);
  --card-shadow-hover: 6px 6px 16px rgb(172, 165, 157), -6px -6px 16px rgb(248, 243, 236);

  /* Botao neumorfico — claro warm */
  --btn-bg:          #d8d3cb;
  --btn-bg-hover:    #ddd8d0;
  --btn-color:       #6e7e92;
  --btn-color-hover: #445566;
  --btn-border:      rgba(255, 248, 240, 0.5);
  --btn-shadow-a:    rgb(248, 243, 236) -4px -2px 16px 0px;
  --btn-shadow-b:    rgba(140, 130, 120, 0.55) 4px 2px 16px 0px;
  --btn-shadow-hover-a: rgb(248, 243, 236) -2px -1px 8px 0px;
  --btn-shadow-hover-b: rgba(140, 130, 120, 0.45) 2px 1px 8px 0px;

  --btn-pri-bg:       #ccc7be;
  --btn-pri-bg-hover: #c6c1b8;
  --btn-pri-color:    #2e4560;
}

/* ----------------------------------------------------------
   TIPOGRAFIA, ESPACO, GEOMETRIA (imutaveis)
---------------------------------------------------------- */
:root {
  --font-display: 'Poppins', 'Helvetica Neue', sans-serif;
  --font-body:    'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono:    'IBM Plex Sans', 'Helvetica Neue', sans-serif;

  --text-xs:   0.6875rem;
  --text-sm:   0.8125rem;
  --text-base: 0.9375rem;
  --text-md:   1.0625rem;
  --text-lg:   1.25rem;
  --text-xl:   1.625rem;
  --text-2xl:  2.25rem;
  --text-3xl:  3rem;

  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  20px;
  --space-5:  32px;
  --space-6:  52px;

  --radius:    4px;
  --radius-sm: 2px;
  --card-radius: 16px;   /* raio neumorfico uniforme dos cards */

  --sidebar-w: 232px;
  --topbar-h:  56px;
  --transition: 150ms ease;
}