/* ==========================================================================
   Condolab Design System — Tokens
   Fonte única de cores, tipografia, espaçamento, raio e sombras.
   Todas as demais folhas (ds-layout, ds-components) consomem apenas
   estas variáveis. Para trocar a cor da marca, altere o bloco "Primária".
   ========================================================================== */

:root {
    /* ---- Primária -------------------------------------------------------- */
    --ds-primary: #635BFF;
    --ds-primary-hover: #5952E6;          /* 10% mais escuro */
    --ds-primary-active: #4F49CC;
    --ds-primary-soft: rgba(99, 91, 255, .08);
    --ds-primary-ring: rgba(99, 91, 255, .30);
    --ds-on-primary: #FFFFFF;

    /* ---- Neutros --------------------------------------------------------- */
    --ds-bg: #FAFBFC;                     /* fundo da página: quase branco (o branco puro ofusca) */
    --ds-bg-subtle: #F6F8FA;              /* fundo secundário / hover */
    --ds-bg-muted: #EBEEF1;
    --ds-border: #E3E8EE;
    --ds-border-strong: #C1C9D2;
    --ds-text: #1A1F36;                   /* texto principal */
    --ds-text-secondary: #697386;         /* texto secundário */
    --ds-text-tertiary: #A3ACB9;          /* placeholders e decoração (não usar em texto essencial) */
    --ds-overlay: rgba(26, 31, 54, .40);
    --ds-bg-glass: rgba(250, 251, 252, .92);         /* topbar translúcida */
    --ds-bg-glass-strong: rgba(250, 251, 252, .95);  /* cabeçalho das popups */
    --ds-veil: rgba(255, 255, 255, .55);             /* véu do progresso e das linhas pintadas pelo código (fichas CPJ) */
    --ds-input-bg: #FFFFFF;                          /* fundo dos campos: branco, destaca sobre o fundo da página */

    /* ---- Status (texto / fundo suave) ----------------------------------- */
    --ds-success: #0E6245;
    --ds-success-bg: #D7F7C2;
    --ds-warning: #983705;
    --ds-warning-bg: #FCEDB9;
    --ds-danger: #A41C4E;
    --ds-danger-bg: #FFE7F2;
    --ds-danger-solid: #DF1B41;
    --ds-danger-solid-hover: #C3173A;
    --ds-neutral: #4F566B;
    --ds-neutral-bg: #EBEEF1;
    --ds-info: #0055BC;
    --ds-info-bg: #CFF5F6;

    /* ---- Tipografia ------------------------------------------------------ */
    --ds-font: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ds-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

    --ds-fs-12: 12px;
    --ds-fs-13: 13px;
    --ds-fs-14: 14px;                     /* base */
    --ds-fs-16: 16px;
    --ds-fs-20: 20px;
    --ds-fs-24: 24px;                     /* valor de card */
    --ds-fs-28: 28px;                     /* título de página / KPI */

    --ds-fw-regular: 400;
    --ds-fw-medium: 500;
    --ds-fw-semibold: 600;
    --ds-fw-bold: 700;

    --ds-lh-tight: 1.25;
    --ds-lh-base: 1.5;

    /* ---- Espaçamento (escala de 4px) ------------------------------------ */
    --ds-space-1: 4px;
    --ds-space-2: 8px;
    --ds-space-3: 12px;
    --ds-space-4: 16px;
    --ds-space-5: 20px;
    --ds-space-6: 24px;
    --ds-space-8: 32px;
    --ds-space-12: 48px;

    /* ---- Raio ------------------------------------------------------------ */
    --ds-radius-sm: 4px;                  /* badges */
    --ds-radius: 6px;                     /* botões, inputs, itens de menu */
    --ds-radius-lg: 8px;                  /* cards */
    --ds-radius-xl: 12px;                 /* modais */
    --ds-radius-pill: 999px;              /* pills */

    /* ---- Sombras --------------------------------------------------------- */
    --ds-shadow-card: 0 1px 2px rgba(0, 0, 0, .06), 0 0 0 1px #E3E8EE;
    --ds-shadow-btn: 0 1px 1px rgba(0, 0, 0, .04);
    --ds-shadow-dropdown: 0 8px 24px rgba(0, 0, 0, .12);
    --ds-shadow-modal: 0 16px 48px rgba(0, 0, 0, .18);
    --ds-focus-ring: 0 0 0 3px var(--ds-primary-ring);

    /* ---- Dimensões de layout -------------------------------------------- */
    --ds-sidebar-width: 240px;
    --ds-topbar-height: 56px;
    --ds-content-max: 1280px;
    --ds-control-height: 32px;
    --ds-control-height-sm: 28px;

    /* ---- Movimento ------------------------------------------------------- */
    --ds-transition: 120ms ease;

    /* ---- Camadas --------------------------------------------------------- */
    --ds-z-sidebar: 40;
    --ds-z-topbar: 30;
    --ds-z-dropdown: 50;
    --ds-z-overlay: 60;
    --ds-z-modal: 70;
    --ds-z-progress: 90;
}

/* ==========================================================================
   Temas — o tema escolhido pelo usuário fica em localStorage['ds.tema'] e é aplicado
   como data-theme no <html> por um script no <head> de cada master (sem "piscar").
   Um tema só redefine tokens de COR; tipografia, espaçamento e layout são comuns.
   Para criar ou ajustar um tema, mexa apenas aqui.
   ========================================================================== */

/* ---- Cinza claro: fundo cinza-pérola, sem o branco puro que ofusca ------- */
html[data-theme="cinza"] {
    --ds-primary: #5A52E0;
    --ds-primary-hover: #4F48CC;
    --ds-primary-active: #453FB5;
    --ds-primary-soft: rgba(90, 82, 224, .10);
    --ds-primary-ring: rgba(90, 82, 224, .30);

    --ds-bg: #EEEFF1;
    --ds-bg-subtle: #E5E7EB;
    --ds-bg-muted: #DCDFE4;
    --ds-border: #D3D7DE;
    --ds-border-strong: #B3BAC5;
    --ds-text: #1F2430;
    --ds-text-secondary: #596273;
    --ds-text-tertiary: #969EAC;
    --ds-neutral-bg: #DCDFE4;
    --ds-bg-glass: rgba(238, 239, 241, .92);
    --ds-bg-glass-strong: rgba(238, 239, 241, .95);
    --ds-veil: rgba(238, 239, 241, .55);
    --ds-input-bg: #F7F8F9;                          /* campos em cinza mais claro que o fundo da tela: destacam onde digitar sem o branco */

    --ds-shadow-card: 0 1px 2px rgba(0, 0, 0, .06), 0 0 0 1px #D3D7DE;
}

/* ---- Escuro (grafite) e Noite (azul suave): base comum dos temas escuros -- */
html[data-theme="escuro"], html[data-theme="noite"] {
    color-scheme: dark;
    /* primária clara com texto escuro no botão: a mesma cor serve de link legível no fundo escuro */
    --ds-primary: #8B85FF;
    --ds-primary-hover: #9D98FF;
    --ds-primary-active: #ADA9FF;
    --ds-primary-soft: rgba(139, 133, 255, .16);
    --ds-primary-ring: rgba(139, 133, 255, .45);
    --ds-on-primary: #15132B;

    --ds-success: #6EE7A0;
    --ds-success-bg: rgba(34, 197, 94, .16);
    --ds-warning: #F5C26B;
    --ds-warning-bg: rgba(245, 158, 11, .16);
    --ds-danger: #FF8FA8;
    --ds-danger-bg: rgba(244, 63, 94, .16);
    --ds-danger-solid: #E5484D;
    --ds-danger-solid-hover: #F2555A;
    --ds-info: #7CC4FF;
    --ds-info-bg: rgba(56, 152, 255, .16);

    --ds-overlay: rgba(0, 0, 0, .60);
    --ds-veil: rgba(0, 0, 0, .45);
    --ds-input-bg: var(--ds-bg);
    --ds-shadow-btn: 0 1px 1px rgba(0, 0, 0, .30);
    --ds-shadow-dropdown: 0 8px 24px rgba(0, 0, 0, .50);
    --ds-shadow-modal: 0 16px 48px rgba(0, 0, 0, .60);
}

html[data-theme="escuro"] {
    --ds-bg: #1C1F24;
    --ds-bg-subtle: #24282E;
    --ds-bg-muted: #2D3238;
    --ds-border: #343A41;
    --ds-border-strong: #4A525B;
    --ds-text: #E6E8EB;
    --ds-text-secondary: #A3ABB5;
    --ds-text-tertiary: #6E7782;
    --ds-neutral: #B4BCC8;
    --ds-neutral-bg: #2D3238;
    --ds-bg-glass: rgba(28, 31, 36, .92);
    --ds-bg-glass-strong: rgba(28, 31, 36, .95);
    --ds-shadow-card: 0 1px 2px rgba(0, 0, 0, .40), 0 0 0 1px #343A41;
}

html[data-theme="noite"] {
    --ds-bg: #121A2B;
    --ds-bg-subtle: #182235;
    --ds-bg-muted: #1F2B40;
    --ds-border: #26334A;
    --ds-border-strong: #36465F;
    --ds-text: #E2E8F0;
    --ds-text-secondary: #9AA8BC;
    --ds-text-tertiary: #5F6E85;
    --ds-neutral: #AEB9CA;
    --ds-neutral-bg: #1F2B40;
    --ds-bg-glass: rgba(18, 26, 43, .92);
    --ds-bg-glass-strong: rgba(18, 26, 43, .95);
    --ds-shadow-card: 0 1px 2px rgba(0, 0, 0, .45), 0 0 0 1px #26334A;
}