/* =====================================================
   CabralCare — Design Tokens
   Responsabilidade: definir TODAS as variáveis CSS.
   Nenhum estilo de componente deve estar aqui.
   ===================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    /* — Brand / Primary (#0d2d6d) — */
    --color-primary: #0d2d6d;
    --color-primary-hover: #0a2152;
    --color-primary-active: #061638;
    --color-primary-subtle: #f0f3f8;
    --color-primary-soft: #d3dceb;
    --color-primary-rgb: 13, 45, 109;

    /* — Sidebar specific — */
    --color-sidebar-toggle-icon: #69fefe;
    --color-sidebar-overlay: rgba(255, 255, 255, 0.1);
    --color-backdrop: rgba(15, 23, 42, 0.4);

    /* — Brand / Secondary (Accent) (#97d4c9) — */
    --color-secondary: #97d4c9;
    --color-secondary-hover: #7ebfb4;
    --color-secondary-subtle: #f2fbf9;
    --color-accent: var(--color-primary);
    --color-accent-subtle: #f0f3f8;

    /* — Semantic Colors (Clínico e Suave) — */
    --color-success: #10b981;
    --color-success-subtle: #ecfdf5;
    --color-danger: #ef4444;
    --color-danger-subtle: #fef2f2;
    --color-warning: #f59e0b;
    --color-warning-subtle: #fffbeb;
    --color-info: #3b82f6;
    --color-info-subtle: #eff6ff;

    /* — Surfaces — */
    --color-bg: #e2e8f0;
    /* Fundo global mais escuro (Slate 200) para contraste flat */
    --color-surface: #ffffff;
    /* Fundo de cards puro */
    --color-surface-hover: #f8fafc;
    --color-surface-elevated: #ffffff;

    /* — Text — */
    --color-text: #1e293b;
    /* Slate 800 - Ótimo contraste */
    --color-text-secondary: #475569;
    /* Slate 600 - Rótulos */
    --color-text-tertiary: #94a3b8;
    /* Slate 400 */
    --color-text-inverse: #ffffff;
    --color-on-primary: #ffffff;
    --color-on-secondary: #0d2d6d;

    /* — Borders — */
    --color-border: #e2e8f0;
    /* Divisões suaves */
    --color-border-strong: #cbd5e1;
    /* Inputs */
    --color-border-subtle: #f1f5f9;
    --color-divider: #f1f5f9;

    /* — Shadows (Minimalista - Flat Design) — */
    --shadow-xs: none;
    --shadow-sm: none;
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-xl: none;
    --shadow-primary: none;

    /* — Radii (Bordas arredondadas) — */
    --radius-base: 0.75rem;
    /* 12px - Valor único para todo o projeto */
    --radius-sm: var(--radius-base);
    --radius-md: var(--radius-base);
    --radius-lg: var(--radius-base);
    --radius-xl: var(--radius-base);
    --radius-2xl: var(--radius-base);
    --radius-full: 9999px;

    /* — Transitions — */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);

    /* — Layout — */
    --sidebar-width: 72px;
    --sidebar-width-expanded: 260px;
    --navbar-height: 64px;

    /* — Typography — */
    --font-family: 'Inter', system-ui, -apple-system, sans-serif;
    --font-family-heading: var(--font-family);
    --font-family-body: var(--font-family);
    --font-size-xs: 0.7rem;
    --font-size-sm: 0.8rem;
    --font-size-base: 0.9rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.15rem;
    --font-size-xl: 1.35rem;
    --font-size-2xl: 1.75rem;

    /* — Bootstrap overrides — */
    --bs-body-font-family: var(--font-family);
    --bs-body-font-size: var(--font-size-base);
    /* Tamanho padrão mais legível */
    --bs-body-bg: var(--color-bg);
    --bs-body-color: var(--color-text);
    --bs-border-color: var(--color-border);
    --bs-primary: var(--color-primary);
    --bs-primary-rgb: var(--color-primary-rgb);
    --bs-primary-bg-subtle: var(--color-primary-subtle);
    --bs-success: var(--color-success);
    --bs-danger: var(--color-danger);
    --bs-warning: var(--color-warning);
    --bs-info: var(--color-info);
}