/* =============================================== */
/* === MEDLEAP GLOBAL THEMING SYSTEM           === */
/* === Light Mode (Default) & Dark Mode        === */
/* =============================================== */

:root {
  /* ================================================ */
  /* === 1. BRAND COLORS (Constantes - Não mudam) === */
  /* ================================================ */
  --brand-blue: #005DFF;
  --brand-blue-hover: #004ecc;
  --brand-blue-light: rgba(0, 93, 255, 0.08);
  --brand-green: #03A678;
  --brand-green-hover: #028f66;
  --brand-red: #dc3545;
  --brand-orange: #ffa344;
  --brand-yellow: #ffc107;
  --brand-purple: #9d5bd2;
  --brand-cyan: #0891b2;

  /* ================================================ */
  /* === 2. SEMANTIC COLORS (Mudam com o tema)    === */
  /* ================================================ */

  /* --- Backgrounds --- */
  --bg-body: #f8f9fa;              /* Fundo da página */
  --bg-surface: #ffffff;           /* Cards, modais, sidebar */
  --bg-surface-secondary: #fafafa; /* Superfícies secundárias */
  --bg-surface-elevated: #ffffff;  /* Elementos elevados (dropdowns) */
  --bg-hover: rgba(13, 110, 253, 0.08); /* Hover em itens */
  --bg-input: #ffffff;             /* Inputs e selects */
  --bg-code: #f1f3f5;              /* Blocos de código */

  /* --- Text --- */
  --text-primary: #212529;         /* Títulos e texto principal */
  --text-secondary: #6c757d;       /* Texto secundário, labels */
  --text-muted: #9ca3af;           /* Texto desabilitado/placeholder */
  --text-inverse: #ffffff;         /* Texto sobre fundos escuros */
  --text-link: #005DFF;            /* Links */
  --text-link-hover: #004ecc;      /* Links hover */

  /* --- Borders --- */
  --border-default: #e5e7eb;       /* Bordas padrão */
  --border-strong: #ced4da;        /* Bordas de inputs */
  --border-subtle: #f3f4f6;        /* Bordas muito sutis */
  --border-focus: #005DFF;         /* Bordas em foco */

  /* --- Shadows --- */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 8px 16px rgba(0, 0, 0, 0.07);
  --shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.12);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.08);
  --shadow-card-hover: 0 8px 30px rgba(0, 0, 0, 0.12);

  /* --- Feedback Colors --- */
  --color-success: #03A678;
  --color-success-bg: rgba(3, 166, 120, 0.1);
  --color-success-text: #028f66;
  
  --color-danger: #dc3545;
  --color-danger-bg: rgba(220, 53, 69, 0.1);
  --color-danger-text: #b02a37;
  
  --color-warning: #ffc107;
  --color-warning-bg: rgba(255, 193, 7, 0.1);
  --color-warning-text: #997404;
  
  --color-info: #0dcaf0;
  --color-info-bg: rgba(13, 202, 240, 0.1);
  --color-info-text: #087990;

  /* --- Primary Action --- */
  --color-primary: #005DFF;
  --color-primary-hover: #004ecc;
  --color-primary-bg: rgba(0, 93, 255, 0.08);
  --color-primary-text: #004ecc;

  /* --- Interactive States --- */
  --state-disabled-bg: #e9ecef;
  --state-disabled-text: #adb5bd;
  --state-selected-bg: rgba(0, 93, 255, 0.12);

  /* ================================================ */
  /* === 3. LEGACY ALIASES (Compatibilidade)      === */
  /* ================================================ */
  /* Manter para não quebrar código existente       */
  --branco-puro: var(--bg-surface);
  --preto-intenso: #181a1a;
  --texto-principal: var(--text-primary);
  --texto-preto-suave: var(--text-primary);
  --texto-secundario: var(--text-secondary);
  --texto-secundario-alternativo: var(--text-secondary);
  --dark-text: var(--text-primary);
  --azul-principal: var(--color-primary);
  --primary-color: var(--color-primary);
  --primary-color-light: var(--color-primary-bg);
  --primary-color-dark: var(--color-primary-hover);
  --primary-color-text: var(--color-primary-text);
  --cor-sucesso: var(--color-success);
  --success-color: var(--color-success);
  --success-color-light: var(--color-success-bg);
  --success-color-text: var(--color-success-text);
  --cor-erro: var(--color-danger);
  --danger-color: var(--color-danger);
  --warning-color: var(--color-warning);
  --fundo-pagina: var(--bg-body);
  --fundo-hover-light: var(--bg-hover);
  --light-bg: var(--bg-body);
  --bg-main: var(--bg-body);
  --bg-card: var(--bg-surface);
  --bg-card-header: var(--bg-surface-secondary);
  --borda-sutil: var(--border-default);
  --cinza-borda-input: var(--border-strong);
  --border-color: var(--border-default);

  /* ================================================ */
  /* === 4. LAYOUT & SIZING (Não mudam)           === */
  /* ================================================ */
  --border-radius: 0.5rem;
  --border-radius-md: 0.75rem;
  --border-radius-lg: 1rem;
  --border-radius-xl: 1.25rem;
  --border-radius-pill: 50rem;

  /* === Transições === */
  --transition-fast: 0.15s ease;
  --transition-base: 0.2s ease;
  --transition-slow: 0.3s ease;
  --transition-speed: 0.3s;

  /* === Tipografia === */
  --font-family-sans-serif: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --font-family-mono: 'Fira Code', 'Consolas', monospace;
}

/* =============================================== */
/* === DARK MODE OVERRIDES                     === */
/* =============================================== */
[data-theme="dark"] {
  /* --- Backgrounds --- */
  --bg-body: #0f0f0f;
  --bg-surface: #1a1a1a;
  --bg-surface-secondary: #242424;
  --bg-surface-elevated: #2a2a2a;
  --bg-hover: rgba(255, 255, 255, 0.08);
  --bg-input: #242424;
  --bg-code: #2d2d2d;

  /* --- Text --- */
  --text-primary: #f3f4f6;
  --text-secondary: #9ca3af;
  --text-muted: #6b7280;
  --text-inverse: #1a1a1a;
  --text-link: #60a5fa;
  --text-link-hover: #93c5fd;

  /* --- Borders --- */
  --border-default: #333333;
  --border-strong: #404040;
  --border-subtle: #262626;
  --border-focus: #60a5fa;

  /* --- Shadows (mais sutis no dark) --- */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 8px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.5);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.4);
  --shadow-card-hover: 0 8px 30px rgba(0, 0, 0, 0.5);

  /* --- Feedback Colors (ajustadas para dark) --- */
  --color-success: #10b981;
  --color-success-bg: rgba(16, 185, 129, 0.15);
  --color-success-text: #34d399;

  --color-danger: #ef4444;
  --color-danger-bg: rgba(239, 68, 68, 0.15);
  --color-danger-text: #f87171;

  --color-warning: #f59e0b;
  --color-warning-bg: rgba(245, 158, 11, 0.15);
  --color-warning-text: #fbbf24;

  --color-info: #22d3ee;
  --color-info-bg: rgba(34, 211, 238, 0.15);
  --color-info-text: #67e8f9;

  /* --- Primary (azul mais vibrante no dark) --- */
  --color-primary: #3b82f6;
  --color-primary-hover: #60a5fa;
  --color-primary-bg: rgba(59, 130, 246, 0.15);
  --color-primary-text: #93c5fd;

  /* --- Interactive States --- */
  --state-disabled-bg: #333333;
  --state-disabled-text: #6b7280;
  --state-selected-bg: rgba(59, 130, 246, 0.2);

  /* --- Legacy dark overrides --- */
  --branco-puro: var(--bg-surface);
  --azul-principal: var(--color-primary);
  --primary-color: var(--color-primary);
}

/* =============================================== */
/* === GLOBAL THEME TRANSITIONS                === */
/* =============================================== */
/* 
   Applied via JS class .theme-transition to prevent 
   color flash on initial page load.
*/
.theme-transition,
.theme-transition body,
.theme-transition .sidebar,
.theme-transition #sidebar,
.theme-transition .top-header,
.theme-transition .main-content,
.theme-transition .card,
.theme-transition .modal-content,
.theme-transition .dropdown-menu,
.theme-transition .form-control,
.theme-transition .btn {
  transition: 
    background-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    border-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    box-shadow 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* =============================================== */
/* === UTILITY CLASSES                         === */
/* =============================================== */
.bg-surface { background-color: var(--bg-surface) !important; }
.bg-body { background-color: var(--bg-body) !important; }
.text-primary { color: var(--text-primary) !important; }
.text-secondary { color: var(--text-secondary) !important; }
.border-default { border-color: var(--border-default) !important; }