/* public/assets/css/variables.css */
:root {
  /* Hantik Corporate Color Tokens */
  --corp-navy: #104466;
  --corp-navy-dark: #0A2F47;
  --corp-navy-light: #185A85;
  --corp-cyan: #00BFFF;
  --corp-cyan-glow: rgba(0, 191, 255, 0.35);
  --corp-cyan-hover: #33CBFF;
  --corp-ice: #D0ECFB;
  --corp-dark: #0C1E2B;
  --corp-dark-surface: #112838;
  --corp-dark-elevated: #163246;
  --corp-slate: #5A758C;
  --corp-text-muted: #8AA4BB;
  --corp-white: #FFFFFF;
  --corp-border: rgba(208, 236, 251, 0.12);
  --corp-border-hover: rgba(0, 191, 255, 0.3);

  /* Corporate Brand & Logo Tokens (M1) */
  --brand-logo-width-expanded: 160px;
  --brand-logo-height-expanded: 36px;
  --brand-logo-size-collapsed: 32px;
  --brand-logo-color: var(--corp-white);
  --brand-logo-accent: var(--corp-cyan);
  --brand-logo-filter-glow: drop-shadow(0 0 12px rgba(0, 191, 255, 0.4));

  --corp-gradient-primary: linear-gradient(135deg, var(--corp-navy-light) 0%, var(--corp-cyan) 100%);
  --corp-gradient-glass: linear-gradient(135deg, rgba(16, 68, 102, 0.4) 0%, rgba(12, 30, 43, 0.6) 100%);
  --corp-gradient-hero: linear-gradient(135deg, rgba(16, 68, 102, 0.35) 0%, rgba(0, 191, 255, 0.15) 100%);

  /* Legal & System Status Tokens */
  --status-success: #00E676;
  --status-success-bg: rgba(0, 230, 118, 0.12);
  --status-warning: #FFB300;
  --status-warning-bg: rgba(255, 179, 0, 0.12);
  --status-danger: #FF5252;
  --status-danger-bg: rgba(255, 82, 82, 0.15);
  --status-info: #00BFFF;
  --status-info-bg: rgba(0, 191, 255, 0.12);

  /* Aero Liquid Glass Backdrops & Filters */
  --glass-bg: rgba(12, 30, 43, 0.65);
  --glass-bg-card: rgba(16, 68, 102, 0.25);
  --glass-bg-hover: rgba(0, 191, 255, 0.08);
  --glass-bg-active: rgba(0, 191, 255, 0.15);
  --glass-blur: blur(28px);
  --glass-blur-sm: blur(12px);
  --glass-border: 1px solid rgba(208, 236, 251, 0.15);
  --glass-border-cyan: 1px solid rgba(0, 191, 255, 0.4);
  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
  --glass-inner-glow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1);
  --glass-specular: inset 0 1px 1px 0 rgba(255, 255, 255, 0.2);
  --glass-glow-cyan: 0 0 20px rgba(0, 191, 255, 0.35);

  /* Typography & Structure */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 72px;
  --topbar-height: 64px;
  --footer-height: 40px;

  /* Theme Tokens */
  --theme-bg-main: var(--corp-dark);
  --theme-text-primary: var(--corp-ice);
  --theme-text-heading: var(--corp-white);

  /* Layer Z-Indices */
  --z-sidebar: 100;
  --z-topbar: 90;
  --z-dropdown: 500;
  --z-modal: 1000;
  --z-toast: 1100;

  /* Motion & Physics */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Light Contrast Adaptation Theme (modo claro) */
[data-theme="light"] {
  /* Fondos y superficies */
  --corp-dark: #EEF4F8;
  --corp-dark-surface: #FFFFFF;
  --corp-dark-elevated: #E4EDF3;

  /* Texto sobre fondo claro */
  --corp-ice: #1C3545;
  --corp-white: #0F2D3F;
  --corp-text-muted: #4E6779;
  --corp-slate: #4E6779;

  /* Bordes */
  --corp-border: rgba(16, 68, 102, 0.18);
  --corp-border-hover: rgba(0, 119, 168, 0.45);

  /* Glass */
  --glass-bg: rgba(255, 255, 255, 0.82);
  --glass-bg-card: rgba(208, 236, 251, 0.42);
  --glass-bg-hover: rgba(0, 119, 168, 0.08);
  --glass-bg-active: rgba(0, 119, 168, 0.14);
  --glass-border: 1px solid rgba(16, 68, 102, 0.16);
  --glass-border-cyan: 1px solid rgba(0, 119, 168, 0.45);
  --glass-shadow: 0 8px 32px 0 rgba(16, 68, 102, 0.12);
  --glass-inner-glow: inset 0 1px 0 0 rgba(255, 255, 255, 0.9);
  --glass-specular: inset 0 1px 1px 0 rgba(255, 255, 255, 0.95);
  --glass-glow-cyan: 0 0 20px rgba(0, 119, 168, 0.18);

  /* Status (versiones con contraste AA sobre claro) */
  --status-success: #0B8A4B;
  --status-success-bg: rgba(11, 138, 75, 0.12);
  --status-warning: #9A6200;
  --status-warning-bg: rgba(154, 98, 0, 0.12);
  --status-danger: #C62828;
  --status-danger-bg: rgba(198, 40, 40, 0.12);
  --status-info: #00689D;
  --status-info-bg: rgba(0, 104, 157, 0.12);

  /* Tokens de tema (compatibilidad) */
  --theme-bg-main: #EEF4F8;
  --theme-text-primary: #1C3545;
  --theme-text-heading: #0F2D3F;
  --theme-glass-panel: rgba(255, 255, 255, 0.85);
  --brand-logo-color: var(--corp-navy);
}

/* --- Modo claro: superficies con fondo oscuro hardcodeado en layout/glass --- */
[data-theme="light"] #app-root {
  background: radial-gradient(circle at 80% 10%, rgba(16, 68, 102, 0.10) 0%, transparent 55%),
              radial-gradient(circle at 20% 90%, rgba(0, 191, 255, 0.06) 0%, transparent 45%),
              var(--corp-dark);
}
[data-theme="light"] .app-topbar { background: rgba(255, 255, 255, 0.85); }
[data-theme="light"] .app-footer { background: rgba(255, 255, 255, 0.92); }
[data-theme="light"] .sidebar-backdrop.active { background: rgba(16, 68, 102, 0.35); }
[data-theme="light"] .app-content::-webkit-scrollbar-thumb { background: rgba(16, 68, 102, 0.22); }
[data-theme="light"] .glass-pill { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.18); }
/* Inputs / selects (clases reales: .input-glass / .select-glass; legacy: .glass-input/.glass-select) */
[data-theme="light"] .input-glass,
[data-theme="light"] .select-glass,
[data-theme="light"] .glass-input,
[data-theme="light"] .glass-select {
  background: #FFFFFF;
  border-color: rgba(16, 68, 102, 0.22);
  color: var(--corp-ice);
}
[data-theme="light"] .input-glass:focus,
[data-theme="light"] .select-glass:focus,
[data-theme="light"] .glass-input:focus,
[data-theme="light"] .glass-select:focus { background: #FFFFFF; }
[data-theme="light"] .select-glass option { background: #FFFFFF; color: #1C3545; }

/* Contenedor de tabla */
[data-theme="light"] .table-responsive { background: rgba(16, 68, 102, 0.03); border-color: rgba(16, 68, 102, 0.12); }

/* Topbar brand pill + tenant/despacho dropdown */
[data-theme="light"] .topbar-brand-preview { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.16); }
[data-theme="light"] .tenant-btn { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.18); color: var(--corp-ice); }
[data-theme="light"] .tenant-btn:hover { background: rgba(16, 68, 102, 0.14); border-color: var(--corp-cyan); }
[data-theme="light"] .tenant-dropdown { background: #FFFFFF; border-color: rgba(16, 68, 102, 0.22); box-shadow: 0 10px 30px rgba(16, 68, 102, 0.18); }
[data-theme="light"] .dropdown-current { background: rgba(0, 119, 168, 0.12); color: var(--corp-navy); }
[data-theme="light"] .dropdown-section { border-top-color: rgba(16, 68, 102, 0.14); }
[data-theme="light"] .dropdown-link:hover { background: rgba(16, 68, 102, 0.08); }

/* Tablas */
[data-theme="light"] .table-glass th { background: #E4EDF3; color: var(--corp-navy); }
[data-theme="light"] .table-glass td { background: rgba(16, 68, 102, 0.04); color: var(--corp-ice); border-bottom-color: rgba(16, 68, 102, 0.10); }
[data-theme="light"] .table-glass tr:hover td { background: rgba(0, 119, 168, 0.08); }
[data-theme="light"] .table-glass th.cell-actions { background: #E4EDF3; color: var(--corp-navy); box-shadow: -4px 0 10px rgba(16, 68, 102, 0.10); }
[data-theme="light"] .table-glass td.cell-actions { background: #FFFFFF; box-shadow: -4px 0 10px rgba(16, 68, 102, 0.10); }
[data-theme="light"] .table-glass tr:hover td.cell-actions { background: #F2F8FC; }

/* Botones (secondary/toggle inactivo); primary conserva su degradado cyan */
[data-theme="light"] .btn-glass { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.22); color: var(--corp-navy); }
[data-theme="light"] .btn-glass.secondary:hover { background: rgba(16, 68, 102, 0.14); border-color: var(--corp-cyan); color: var(--corp-navy); }

/* Card meta + preview + modal */
[data-theme="light"] .card-meta { background: rgba(16, 68, 102, 0.06); }
[data-theme="light"] .glass-preview-container { background: rgba(255, 255, 255, 0.6); box-shadow: inset 0 2px 4px rgba(16, 68, 102, 0.08); }
[data-theme="light"] .glass-modal-backdrop { background: rgba(16, 68, 102, 0.45); }

/* Chat del Copilot + toasts */
[data-theme="light"] .chat-bubble-user { background: rgba(0, 119, 168, 0.12); border-color: rgba(0, 119, 168, 0.35); color: var(--corp-ice); }
[data-theme="light"] .chat-bubble-ai { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.18); color: var(--corp-ice); }
[data-theme="light"] .chat-bubble-fallback { background: rgba(198, 40, 40, 0.08); border-color: rgba(198, 40, 40, 0.35); color: var(--corp-ice); }
[data-theme="light"] .chat-bubble-error { background: rgba(198, 40, 40, 0.10); border-color: #C62828; color: #B71C1C; }
[data-theme="light"] .toast-success { background: rgba(0, 119, 168, 0.12); border-color: rgba(0, 119, 168, 0.45); color: var(--corp-navy); }
[data-theme="light"] .toast-error { background: rgba(198, 40, 40, 0.12); border-color: rgba(198, 40, 40, 0.45); color: #B71C1C; }

/* Acento de KPI (cyan oscuro para contraste sobre claro) */
[data-theme="light"] .kpi-value-cyan { color: #006F9E; }

/* Visor de documentos + timeline del expediente */
[data-theme="light"] .doc-viewer { background: rgba(255, 255, 255, 0.75); border-color: rgba(16, 68, 102, 0.14); }
[data-theme="light"] .act-item { background: rgba(16, 68, 102, 0.06); }
[data-theme="light"] .anexo-item { background: rgba(0, 119, 168, 0.06); border-color: rgba(0, 119, 168, 0.25); }
[data-theme="light"] .section-divider,
[data-theme="light"] .section-divider-lg { border-top-color: rgba(16, 68, 102, 0.14); }

/* Cyan → versión oscura para contraste sobre claro */
[data-theme="light"] .doc-h4,
[data-theme="light"] .chat-author,
[data-theme="light"] .text-cyan,
[data-theme="light"] .text-cyan-sm,
[data-theme="light"] .text-cyan-bold { color: #006F9E; }

/* Burbuja de chat genérica (bienvenida) + drawer lateral + cabeceras */
[data-theme="light"] .chat-bubble { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.18); }
[data-theme="light"] .drawer { background: #FFFFFF; border-left-color: rgba(16, 68, 102, 0.22); box-shadow: -5px 0 25px rgba(16, 68, 102, 0.18); }
[data-theme="light"] .panel-head,
[data-theme="light"] .drawer-head,
[data-theme="light"] .cuaderno-tabs { border-bottom-color: rgba(16, 68, 102, 0.14); }

/* Vista previa del logo (configuración) */
[data-theme="light"] .logo-preview-box { background: rgba(255, 255, 255, 0.6); border-color: rgba(0, 119, 168, 0.35); }

/* Refuerzo explícito del botón toggle inactivo (Cronología / Kanban) */
[data-theme="light"] .btn-glass.secondary { background: rgba(16, 68, 102, 0.08); color: var(--corp-navy); border-color: rgba(16, 68, 102, 0.22); }

/* Contenedor del toggle de vista (Kanban / Cronología) + botón móvil */
[data-theme="light"] .view-toggle-group { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.16); }
[data-theme="light"] .sidebar-mobile-toggle { background: rgba(16, 68, 102, 0.08); border-color: rgba(16, 68, 102, 0.18); color: var(--corp-ice); }

/* Etiquetas cyan de UI (tenant-role, dropdown-title, topbar-role-label, copilot-sub) */
[data-theme="light"] .tenant-role,
[data-theme="light"] .dropdown-title,
[data-theme="light"] .topbar-role-label,
[data-theme="light"] .copilot-sub { color: #006F9E; }

/* Transición suave al alternar tema (respeta prefers-reduced-motion) */
body, #app-root, .app-topbar, .app-footer, .app-sidebar, .glass-panel {
  transition: background-color var(--transition-normal), color var(--transition-normal), border-color var(--transition-normal);
}
@media (prefers-reduced-motion: reduce) {
  body, #app-root, .app-topbar, .app-footer, .app-sidebar, .glass-panel { transition: none; }
}