/* Apariencia: menú gris neutro, identidad roja y modo noche grafito. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --sidebar-bg: #f8f9fb;
  --sidebar-ink: #49566a;
  --sidebar-muted: #59697f;
  --sidebar-hover: #edf0f5;
  --sidebar-active: #fcecef;
  --sidebar-active-ink: #b42236;
  --surface: #fff;
  --surface-soft: #f2f4f8;
  --control-bg: #fff;
}
.sidebar {
  background: var(--sidebar-bg);
  color: var(--sidebar-ink);
  border-right: 1px solid var(--line);
  scrollbar-color: #bdc5d1 transparent;
}
.sidebar .brand-name { color: var(--brand); }
.sidebar .brand-sub, .nav-caption { color: var(--sidebar-muted); }
.nav-item { color: var(--sidebar-ink); }
.nav-item svg { color: #768298; }
.nav-item:hover { color: var(--ink); background: var(--sidebar-hover); }
.nav-item.active {
  background: var(--sidebar-active);
  color: var(--sidebar-active-ink);
  box-shadow: inset 3px 0 0 var(--brand);
}
.nav-item.active svg { color: var(--sidebar-active-ink); }
.nav-count { background: #f5d6dd; color: #a82438; }
.sidebar .demo-card { background: #eef1f5; color: #6d788b; border-color: #e0e5ed; }
.sidebar .demo-card strong { color: #48566b; }
.profile { border-color: var(--line); }
.profile .name { color: var(--ink); }
.profile .role { color: var(--sidebar-muted); }
.profile .avatar { color: #58687f; background: #e6ebf1; }
.profile button, .nav-close { color: var(--sidebar-ink); }
.theme-switch {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
  padding: 4px;
  border: 1px solid var(--line);
  background: #f1f3f7;
  border-radius: 11px;
}
.theme-option {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #657287;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.theme-option svg { width: 16px; height: 16px; }
.theme-option:hover { color: var(--ink); background: #e8ecf2; }
.theme-option[aria-pressed="true"] {
  color: #ac2437;
  background: #fff;
  border-color: #e2e6ed;
  box-shadow: 0 1px 3px #24344910;
}
.top-actions { gap: 11px; }
.login-box>.theme-switch { margin-bottom: 22px; }
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #15171d;
  --white: #22262f;
  --ink: #e8ebf2;
  --muted: #a7afbf;
  --line: #363d49;
  --brand: #ec5266;
  --brand-dark: #c9384d;
  --brand-light: #3c252d;
  --accent: #adcbf3;
  --green: #9be0be;
  --green-light: #1f372f;
  --blue: #b2d0fa;
  --blue-light: #25374d;
  --amber: #efc779;
  --amber-light: #3a301e;
  --red: #ffacb9;
  --red-light: #40262e;
  --purple: #d6c0f5;
  --surface: #22262f;
  --surface-soft: #2a303b;
  --control-bg: #1b1f27;
  --sidebar-bg: #1c1f26;
  --sidebar-ink: #d1d6e1;
  --sidebar-muted: #a4adbe;
  --sidebar-hover: #292e39;
  --sidebar-active: #39252e;
  --sidebar-active-ink: #ff9cab;
}
[data-theme="dark"] body { background: var(--bg); color: var(--ink); }
[data-theme="dark"] .sidebar { scrollbar-color: #535d6e transparent; }
[data-theme="dark"] .nav-item svg { color: #a5afc0; }
[data-theme="dark"] .nav-item.active svg { color: var(--sidebar-active-ink); }
[data-theme="dark"] .nav-count { background: #59303b; color: #ffc6cf; }
[data-theme="dark"] .sidebar .demo-card { background: #242a34; color: var(--muted); border-color: var(--line); }
[data-theme="dark"] .sidebar .demo-card strong { color: var(--ink); }
[data-theme="dark"] .profile .avatar { background: #343d4b; color: #dce7f8; }
[data-theme="dark"] :is(h1,h2,h3,.stat-number,.breadcrumb strong,.task-title,.workflow-item .number,.empty h3,.account-choice strong,.login-box h2) { color: var(--ink); }
[data-theme="dark"] :is(.topbar,.card,.stat,.next-step,dialog,.account-choice) { background: var(--surface); color: var(--ink); border-color: var(--line); box-shadow: none; }
[data-theme="dark"] :is(.page-heading p,.card-head p,.stat-top,.stat-foot,.task-meta,.table-footer,.priority p,.next-step p,.footnote,.breadcrumb,.top-actions .local,.next-step-label) { color: var(--muted); }
[data-theme="dark"] .top-actions .icon-btn, [data-theme="dark"] .icon-btn { background: var(--surface-soft); color: #d5deed; border-color: var(--line); }
[data-theme="dark"] .icon-btn:hover { background: #394253; }
[data-theme="dark"] .nav-close { background: transparent; }
[data-theme="dark"] .theme-switch { background: #171b22; border-color: #3b4350; }
[data-theme="dark"] .theme-option { color: #b1bbce; }
[data-theme="dark"] .theme-option:hover { background: #2b3341; color: #fff; }
[data-theme="dark"] .theme-option[aria-pressed="true"] { background: #364154; border-color: #55637b; color: #fff; box-shadow: none; }
[data-theme="dark"] .demo-strip { background: #252f3e; border-color: #37475e; color: #bdcce2; }
[data-theme="dark"] .demo-strip strong { color: #d6e4f7; }
[data-theme="dark"] .btn { background: var(--surface-soft); color: #e5eaf3; border-color: #475062; box-shadow: none; }
[data-theme="dark"] .btn:hover { background: #384355; border-color: #7084a0; }
[data-theme="dark"] .btn.primary { background: #375778; color: #fff; border-color: #587697; }
[data-theme="dark"] .btn.primary:hover { background: #466b92; }
[data-theme="dark"] .btn[data-action="new"], [data-theme="dark"] .login-box .btn.primary { background: #c63147; border-color: #e85267; color: #fff; }
[data-theme="dark"] .btn[data-action="new"]:hover, [data-theme="dark"] .login-box .btn.primary:hover { background: #db3d54; }
[data-theme="dark"] .btn.danger { background: #35222b; color: #ffadba; border-color: #875260; }
[data-theme="dark"] .link { color: #b4d0f4; }
[data-theme="dark"] .link:hover { color: #e5f0ff; }
[data-theme="dark"] .badge { background: #333b49; color: #d7ddea; }
[data-theme="dark"] .badge.green { background: var(--green-light); color: var(--green); }
[data-theme="dark"] .badge.blue { background: var(--blue-light); color: var(--blue); }
[data-theme="dark"] .badge.amber { background: var(--amber-light); color: var(--amber); }
[data-theme="dark"] .badge.red { background: var(--red-light); color: var(--red); }
[data-theme="dark"] .badge.purple { background: #372e47; color: var(--purple); }
[data-theme="dark"] .avatar { background: #334156; color: #d4e5ff; }
[data-theme="dark"] .avatar.blue { background: var(--blue-light); color: var(--blue); }
[data-theme="dark"] .avatar.purple { background: #372e47; color: var(--purple); }
[data-theme="dark"] .avatar.amber { background: var(--amber-light); color: var(--amber); }
[data-theme="dark"] .stat-icon, [data-theme="dark"] .next-step-icon { background: #2e3b50; color: #bfdaff; }
[data-theme="dark"] .stat.green .stat-icon { background: var(--green-light); color: var(--green); }
[data-theme="dark"] .stat.blue .stat-icon { background: var(--blue-light); color: var(--blue); }
[data-theme="dark"] .stat.amber .stat-icon { background: var(--amber-light); color: var(--amber); }
[data-theme="dark"] .stat.red .stat-icon { background: var(--red-light); color: var(--red); }
[data-theme="dark"] .stat.interactive:hover { border-color: #7086a3; }
[data-theme="dark"] .stat.interactive.selected { border-color: #95b8e5; box-shadow: 0 0 0 2px #354964; }
[data-theme="dark"] .next-step { border-left-color: #97b8e4; }
[data-theme="dark"] .count { color: #bfd6f5; background: #303f53; }
[data-theme="dark"] .tab { color: #b0b9c9; }
[data-theme="dark"] .tab:hover { color: #f2f5fc; }
[data-theme="dark"] .tab.active { color: #bfd8fb; border-color: #9fc3f1; }
[data-theme="dark"] th { background: #1c2029; color: #aeb9ca; }
[data-theme="dark"] td { color: #d3dae6; border-top-color: #333b48; }
[data-theme="dark"] tr.clickable:hover td { background: #2d3543; }
[data-theme="dark"] :is(.task-code,.task-open,.file-row svg) { color: #adc4e4; }
[data-theme="dark"] .due { color: #cbd4e3; }
[data-theme="dark"] .due.overdue { color: var(--red); }
[data-theme="dark"] .note-card { background: #263143; border-color: #3e4c62; }
[data-theme="dark"] .note-card h3 { color: #dbe7f9; }
[data-theme="dark"] .note-card p { color: #bdcce2; }
[data-theme="dark"] .note-card>svg { color: #b1cff5; }
[data-theme="dark"] .workflow-item strong { color: #bdcbe0; }
[data-theme="dark"] .workflow-item:after { border-color: var(--surface); background: #7f99bb; box-shadow: 0 0 0 1px #44536a; }
[data-theme="dark"] .workflow-item.active:after { background: #b3d1f8; }
[data-theme="dark"] :is(.search,.filter,.field input,.field select,.field textarea,.route-row select) { color: #e4eaf4; background: var(--control-bg); border-color: #475368; }
[data-theme="dark"] .search input { color: #e4eaf4; }
[data-theme="dark"] :is(input,textarea)::placeholder { color: #9ca9bd; opacity: 1; }
[data-theme="dark"] :is(.field>span,.field>label) { color: #cad3e3; }
[data-theme="dark"] input[readonly] { background: #272e3a; color: #bcc6d7; }
[data-theme="dark"] .proposed, [data-theme="dark"] .alert { background: #362e21; border-color: #665434; color: #efd29a; }
[data-theme="dark"] .alert.green { background: var(--green-light); border-color: #39634e; color: var(--green); }
[data-theme="dark"] .alert.red, [data-theme="dark"] .error { background: var(--red-light); border-color: #71404e; color: var(--red); }
[data-theme="dark"] .stage { color: #a4b1c5; }
[data-theme="dark"] .stage-num { background: var(--surface); border-color: #47556c; color: #cbd7e9; }
[data-theme="dark"] .stage.done .stage-num { background: #2b3d56; color: #c0dafc; border-color: #496080; }
[data-theme="dark"] .stage.current { color: #c0dafc; }
[data-theme="dark"] .stage.current .stage-num { background: #476b99; color: #fff; border-color: #86a7d1; box-shadow: 0 0 0 4px #2b3b50; }
[data-theme="dark"] .timeline-item { border-left-color: var(--line); }
[data-theme="dark"] .timeline-item:before { border-color: var(--surface); background: #93afd1; box-shadow: 0 0 0 1px #51627a; }
[data-theme="dark"] .upload { background: #1c2532; border-color: #5b7496; }
[data-theme="dark"] .progress-track { background: #353e4d; }
[data-theme="dark"] .progress-fill { background: #8eaed8; }
[data-theme="dark"] .gantt-header { color: #bdcde3; background: #1c2430; }
[data-theme="dark"] .gantt-cell { border-color: #323b48; }
[data-theme="dark"] .gantt-today { background: #2a3547; }
[data-theme="dark"] .gantt-bar { color: #e6f0ff; background: #3a567c; border-color: #7392ba; }
[data-theme="dark"] .gantt-bar.late { color: #ffe0a7; background: #614828; border-color: #a17b46; }
[data-theme="dark"] .notification.unread { background: #28354a; }
[data-theme="dark"] dialog::backdrop { background: #06070caa; }
[data-theme="dark"] .account-choice:hover { background: #303a4b; border-color: #7391b8; }
[data-theme="dark"] .account-choice.selected { background: #2c3a50; border-color: #89afdF; box-shadow: inset 3px 0 0 #a0c5f6; }
[data-theme="dark"] .login { background: var(--surface); }
[data-theme="dark"] .login-aside { background: #1a1d24; }
[data-theme="dark"] .login-aside h1 { color: #f2f4f9; }
[data-theme="dark"] .demo-login-label { color: #c0d6f5; background: #293850; border-color: #466081; }
[data-theme="dark"] #toast { background: #364257; border-color: #677e9c; color: #fff; }
@media (max-width:1300px) { .top-actions .local { display: none; } }
@media (max-width:620px) {
  .theme-option { padding: 6px; min-height: 32px; width: 33px; }
  .theme-option span { display: none; }
  .theme-switch { padding: 3px; gap: 1px; }
  .top-actions { gap: 6px; }
  .top-actions>.icon-btn { width: 34px; height: 36px; }
  .top-actions>span { display: none; }
  .breadcrumb strong { max-width: 104px; }
  .topbar>.row { flex: 1; min-width: 0; }
  .login-box>.theme-switch .theme-option { width: auto; padding: 6px 10px; }
  .login-box>.theme-switch .theme-option span { display: inline; }
}
