/*
  Tokens do Design System OdontoNet.
  Direção visual: identidade oficial da clínica (Amanda Müller — monograma AM,
  marrom escuro + dourado/bege + off-white), ambiente profissional de saúde,
  sofisticado sem excesso, boa legibilidade, poucos níveis de elevação.

  Paleta derivada da logo em wwwroot/images/branding/amanda-muller-logo.jpeg
  (ver docs/tasks/T02-.../TASK.md para a tabela de contraste WCAG que embasou os
  ajustes em relação aos tons "brutos" extraídos da logo).

  Breakpoints usados em todo o design system (não há var() dentro de @media,
  então os valores abaixo são literais e devem ser repetidos onde necessário):
    mobile:  < 768px
    tablet:  768px – 1023px
    desktop: >= 1024px
*/

:root {
    /* ===== Cor — marca / ação primária (marrom escuro da logo) ===== */
    --color-primary: #584b42;
    --color-primary-hover: #53443c;
    --color-primary-active: #453b33;
    --color-primary-contrast: #ffffff;
    --color-primary-soft: #efe7de;

    /* ===== Cor — accent (dourado/bege da logo) =====
       Não usado como fundo sólido com texto branco: contraste insuficiente
       (--color-accent puro vs branco ≈ 2.5:1). Uso principal: elementos
       decorativos, ícones, badges/bordas com texto escuro. --color-accent-strong
       é a variante escurecida para texto/links em estilo accent sobre fundo claro. */
    --color-accent: #b2a08c;
    --color-accent-strong: #74685b;
    --color-accent-soft: #f0e8dd;

    /* ===== Cor — neutros (fundo, superfície, texto) ===== */
    --color-bg: #f7eee5;
    --color-surface: #ffffff;
    --color-surface-alt: #faf4ed;
    --color-border: #e6dacb;
    --color-border-strong: #968e84;
    --color-text-primary: #362e29;
    --color-text-secondary: #736558;
    --color-text-disabled: #b4a99b;
    --color-text-inverse: #ffffff;

    /* ===== Cor — feedback semântico ===== */
    --color-success: #1e7a46;
    --color-success-bg: #e6f4ec;
    --color-success-border: #bee3cc;

    --color-warning: #8a5b00;
    --color-warning-bg: #fdf3dc;
    --color-warning-border: #f0d896;

    --color-error: #b3261e;
    --color-error-hover: #96201a;
    --color-error-bg: #fcecea;
    --color-error-border: #f3c6c3;

    --color-info: #205e86;
    --color-info-bg: #e7f1f8;
    --color-info-border: #bbdbec;

    /* ===== Cor — shell da aplicação (sidebar/header) ===== */
    --color-shell-sidebar-bg: #2e241c;
    --color-shell-sidebar-text: #d9cfc3;
    --color-shell-sidebar-text-active: #ffffff;
    --color-shell-sidebar-active-bg: rgba(255, 255, 255, 0.09);
    --color-shell-sidebar-hover-bg: rgba(255, 255, 255, 0.05);
    --color-shell-sidebar-border: rgba(255, 255, 255, 0.08);
    --color-shell-header-bg: #ffffff;
    --color-shell-header-border: var(--color-border);
    --color-overlay: rgba(46, 36, 28, 0.5);

    /* ===== Tipografia =====
       Fonte do sistema operacional: sem dependência de rede externa
       (disponibilidade e privacidade em ambiente clínico). */
    --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8125rem;
    --font-size-base: 0.9375rem;
    --font-size-lg: 1.0625rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;

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

    --line-height-tight: 1.25;
    --line-height-base: 1.55;

    /* ===== Espaçamento (escala base 4px) ===== */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;

    /* ===== Raio de borda (poucos níveis, nada excessivamente arredondado) ===== */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --radius-pill: 999px;

    /* ===== Elevação (poucos níveis, sombras discretas) ===== */
    --shadow-sm: 0 1px 2px rgba(46, 36, 28, 0.06);
    --shadow-md: 0 2px 10px rgba(46, 36, 28, 0.09);
    --shadow-lg: 0 10px 28px rgba(46, 36, 28, 0.16);

    /* ===== Transições ===== */
    --transition-fast: 120ms ease;
    --transition-base: 180ms ease;

    /* ===== Camadas ===== */
    --z-dropdown: 1000;
    --z-sticky: 1010;
    --z-drawer: 1020;
    --z-modal-backdrop: 1030;
    --z-modal: 1040;
}
