/* Arrenda Dashboard — diseño con sidebar (Larkon inspiration) */

:root {
  color-scheme: light;
  --arrenda-teal: #2A7B92;
  --arrenda-teal-light: #5BA0B5;
  --arrenda-deep: #1A5567;
  --bg: #ffffff;
  --bg-soft: #F5F8FA; /* fondo suave de marca */
  --bg-hover: #EFF6F8;
  --border: #E1E7EC;
  --border-strong: #CBD3DB;
  --text: #1F2933;
  --text-soft: #4A5763;
  --text-muted: #9AA7B2;
  --accent: #4379EE;
  --accent-hover: #3563C1;
  --accent-soft: rgba(67, 121, 238, 0.1);
  --danger: #ef5f5f;
  --danger-soft: #fee2e2;
  --success: #22c55e;
  --success-soft: #dcfce7;
  --warning: #f9b931;
  --warning-soft: #fef3c7;
  --sidebar-bg: var(--arrenda-deep);
  --sidebar-text: #B0D2DB;
  --sidebar-text-active: #ffffff;
  --sidebar-hover-bg: rgba(255, 255, 255, .12);
  --sidebar-border: rgba(255, 255, 255, .12);
  --sidebar-w: 240px; /* Slightly wider */
  --header-h: 70px; /* Taller header like screenshot */
  --radius: 12px; /* Rounder corners */
  --radius-sm: 8px;
  --shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* ── Dark theme ─────────────────────────── */
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #1e2130;
  --bg-soft: #171b27;
  --bg-hover: #252b3d;
  --border: #2e3448;
  --border-strong: #3a4261;
  --text: #e2e6f0;
  --text-soft: #9aa3c0;
  --text-muted: #636e94;
  --sidebar-bg: var(--arrenda-deep);
  --shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.5);
  --success-soft: rgba(34, 197, 94, 0.15);
  --danger-soft: rgba(239, 95, 95, 0.15);
  --warning-soft: rgba(249, 185, 49, 0.15);
  --accent-soft: rgba(67, 121, 238, 0.18);
}

[data-theme="dark"] .sidebar-user { color: var(--sidebar-text-active) !important; }
[data-theme="dark"] .btn-signout { color: var(--sidebar-text); }
[data-theme="dark"] .btn-menu span { background: var(--text); }
[data-theme="dark"] .block-title { color: var(--text); }
[data-theme="dark"] .sidebar-section-label { opacity: 0.5; }
/* Sidebar nav items en dark mode (el sidebar siempre es teal oscuro) */
[data-theme="dark"] .tab { color: var(--sidebar-text) !important; }
[data-theme="dark"] .tab svg { stroke: var(--sidebar-text) !important; opacity: 0.85; }
[data-theme="dark"] .tab:hover { background: var(--sidebar-hover-bg) !important; color: var(--sidebar-text-active) !important; }
[data-theme="dark"] .tab:hover svg { stroke: var(--sidebar-text-active) !important; opacity: 1; }
[data-theme="dark"] .tab.active { color: var(--sidebar-text-active) !important; }
[data-theme="dark"] .tab.active svg { stroke: var(--sidebar-text-active) !important; }
/* Misceláneos dark mode */
[data-theme="dark"] .table .badge.muted { color: var(--text); }
[data-theme="dark"] .alert-item { background: var(--bg-hover); color: var(--text); border-left-color: var(--warning); }
[data-theme="dark"] .alert-item.danger { background: rgba(239, 95, 95, 0.20); color: #fcd9d9; border-left-color: var(--danger); }
[data-theme="dark"] .alert-item.warning { background: rgba(249, 185, 49, 0.18); color: #fde8b3; border-left-color: var(--warning); }
[data-theme="dark"] .alert-item.success { background: rgba(34, 197, 94, 0.18); color: #b8e6c9; border-left-color: var(--success); }
[data-theme="dark"] .alert-item.info { background: rgba(67, 121, 238, 0.18); color: #b5cbf5; border-left-color: var(--accent); }
[data-theme="dark"] .btn-toggle-pass:hover { color: var(--text); }
[data-theme="dark"] .header-title { color: var(--text); }
[data-theme="dark"] .profile-name { color: var(--text); }
[data-theme="dark"] .profile-role { color: var(--text-muted); }
[data-theme="dark"] .welcome-card { background: var(--bg); }
[data-theme="dark"] .modal { background: var(--bg); }
[data-theme="dark"] .day-detail-item { background: var(--bg-hover); }

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  overflow-x: hidden;
  max-width: 100%;
  width: 100%;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--bg-soft);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
}

h1,
h2,
h3,
h4 {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
}

.hidden {
  display: none !important;
}