/* ============================================================
   THEME PART 02 — Timeline (gantt), planificador, agenda y dashboard
   Solo aspecto: paddings, radios, bordes, colores, tipografía, sombras.
   La geometría (posiciones, alturas de carriles, anchos de columnas,
   scrolls, sticky) la calcula el JS y se deja intacta.
   ============================================================ */

/* ---------- Contenedor de página ---------- */
.planner-shell { padding: 20px 24px 40px; }

/* ============================================================
   GANTT — barra de herramientas
   ============================================================ */
.gantt-toolbar {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: 12px 16px; margin-bottom: 16px; gap: 14px;
}
/* Segmented control (Semanal · Mensual · Trimestral · Anual) */
.gantt-zoom {
  background: var(--bg-subtle); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 3px; gap: 2px;
}
.gantt-zoom-btn {
  font-size: 12.5px; font-weight: 600; color: var(--text-muted);
  padding: 5px 12px; border-radius: 5px; line-height: 1.3;
}
.gantt-zoom-btn:hover { color: var(--text); background: rgba(255, 255, 255, .6); }
.gantt-zoom-btn.active { background: var(--card); color: var(--primary); box-shadow: var(--shadow-sm); }
/* Slider de zoom */
.gantt-zoom-slider-wrap { gap: 10px; }
.gantt-zoom-slider { width: 140px; accent-color: var(--primary); }
.gantt-zoom-val { font-size: 12px; font-weight: 700; color: var(--text-secondary); min-width: 56px; }
/* Navegación ‹ Hoy › */
.gantt-nav { gap: 6px; }
.gantt-nav-btn {
  width: 32px; height: 32px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--card); color: var(--text-secondary);
  box-shadow: var(--shadow-xs); transition: background .12s, border-color .12s, color .12s;
}
.gantt-nav-btn:hover { background: var(--bg-subtle); border-color: var(--line-strong); color: var(--text); }
.gantt-nav-btn svg { width: 14px; height: 14px; stroke-width: 2.2; }
.gantt-today-btn {
  height: 32px; padding: 0 14px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--card); color: var(--text);
  font-size: 12.5px; font-weight: 600; font-family: inherit; box-shadow: var(--shadow-xs);
  transition: background .12s, border-color .12s, color .12s;
}
.gantt-today-btn:hover { background: var(--primary-soft); color: var(--primary); border-color: var(--primary-light); }
.gantt-window-label { font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: var(--text); }
/* Leyenda: puntos de color */
.gantt-legend { gap: 14px; }
.gantt-legend .lg { font-size: 11.5px; font-weight: 600; color: var(--text-secondary); gap: 6px; }
.gantt-legend .lg i { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(255, 255, 255, .9), 0 0 0 3px var(--line); }

/* ============================================================
   GANTT — lienzo, eje y rejilla
   ============================================================ */
.gantt-scroll {
  border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--card);
  box-shadow: var(--shadow-card);
}
.gantt-scroll::-webkit-scrollbar { height: 10px; }
.gantt-scroll::-webkit-scrollbar-track { background: transparent; }
.gantt-scroll::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 5px; border: 2px solid var(--card); background-clip: padding-box; }

.gantt-axis { background: var(--card-soft); border-bottom: 1px solid var(--line); border-radius: var(--r-lg) var(--r-lg) 0 0; }
.gantt-axis-row { border-bottom: 1px solid var(--line-soft); }
.gantt-axis-cell {
  border-left: 1px solid var(--line-soft);
  font-size: 10.5px; font-weight: 600; color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.gantt-axis-row.lvl-q .gantt-axis-cell,
.gantt-axis-row.lvl-m .gantt-axis-cell {
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary);
}
.gantt-axis-row.lvl-d .gantt-axis-cell { font-size: 10px; color: var(--text-muted); }
.gantt-axis-cell.is-current { background: var(--primary-soft); color: var(--primary); }

.gantt-gridline { background: var(--line-soft); opacity: 1; }
.gantt-weekend { background: rgba(20, 40, 45, 0.028); }
/* Hoy: línea teal con etiqueta en píldora */
.gantt-today { border-left: 2px solid var(--primary); }
.gantt-today::before {
  content: 'Hoy'; top: auto; bottom: 6px; left: 5px;   /* abajo: arriba se solapaba con la primera sección */
  font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--primary); background: var(--primary-soft);
  padding: 1px 6px; border-radius: var(--r-pill); line-height: 1.5;
}

/* Cabeceras de carpeta y de proyecto (sticky) */
.gantt-section-head {
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--text-muted); opacity: .9; margin: 10px 0 4px; padding: 3px 6px;
  border-radius: var(--r-xs);
}
.gantt-section-head:hover { opacity: 1; color: var(--text); background: var(--bg-subtle); }
.gantt-section-head .gantt-sec-count {
  font-size: 10px; color: var(--text-muted); background: var(--bg-subtle);
  border: 1px solid var(--line); border-radius: var(--r-pill); padding: 0 6px; line-height: 1.5;
}
.gantt-sec-chevron { color: var(--text-faint); }
.gantt-group-box { border: 1px solid var(--line-soft); border-radius: var(--r-md); background: rgba(20, 40, 45, 0.012); }
.gantt-project-head {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md);
  box-shadow: var(--shadow-xs); padding: 5px 12px 5px 8px; margin: 18px 0 8px;
}
.gantt-project-badge { width: 20px; height: 20px; border-radius: 5px; font-size: 11px; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .18); }
.gantt-project-name { font-size: 13.5px; font-weight: 800; letter-spacing: -.01em; }
.gantt-lanes-empty { font-size: 11.5px; color: var(--text-faint); }
.gantt-empty { color: var(--text-muted); font-size: 13px; padding: 48px 24px; }

/* ============================================================
   GANTT — barras: versión suave con texto oscuro y borde de color
   El JS pinta el fondo saturado inline (background: col.fill), por eso
   estas reglas llevan !important: se sustituye por el tono suave.
   ============================================================ */
.gantt-bar { border-radius: 5px; transition: box-shadow .15s, opacity .15s; }
.gantt-bar:hover { filter: brightness(.97); z-index: 4; }
.gantt-bar-label { font-size: 11px; font-weight: 600; color: var(--text); }
.gantt-bar-head { padding: 0 7px; gap: 4px; }
.gantt-bar-chevron { color: var(--text-muted); }
.gantt-bar-icon { color: var(--text-secondary); opacity: 1; }

.gantt-bar.kind-objective {
  background: var(--warn-soft) !important;        /* pisa el inline saturado */
  border: 1px solid var(--warn-line); box-shadow: inset 3px 0 0 var(--accent-orange);
}
.gantt-bar.kind-objective .gantt-bar-icon, .gantt-bar.kind-objective .gantt-bar-chevron { color: var(--warn); }

.gantt-bar.kind-goal {
  background: var(--violet-soft) !important;      /* pisa el inline saturado */
  border: 1px solid #ddd6fe; box-shadow: inset 3px 0 0 #7c3aed;
}
.gantt-bar.kind-goal .gantt-bar-icon, .gantt-bar.kind-goal .gantt-bar-chevron { color: var(--violet); }

.gantt-bar.kind-strategy {
  background: var(--primary-soft) !important;     /* pisa el inline saturado */
  border: 1px solid var(--primary-light); box-shadow: inset 3px 0 0 var(--primary);
}
.gantt-bar.kind-strategy .gantt-bar-icon, .gantt-bar.kind-strategy .gantt-bar-chevron { color: var(--primary); }

/* Tareas: tarjeta clara con borde verde (como los eventos de la agenda) */
.gantt-bar.gantt-task { background: var(--card); border: 1px solid var(--line); box-shadow: inset 3px 0 0 var(--ok); }
.gantt-bar.gantt-task .gantt-bar-label { color: var(--text); }
.gantt-bar.gantt-task.done { background: var(--card-soft); opacity: .7; }
.gantt-bar.gantt-task.done .gantt-bar-label { color: var(--text-muted); }

/* Carpetas: recuadro casi transparente */
.gantt-bar.kind-folder { background: rgba(20, 40, 45, 0.012); border: 1px solid var(--line-soft); border-radius: var(--r-md); }
.gantt-bar.kind-folder:hover { box-shadow: none; }
.gantt-bar.kind-folder .gantt-bar-label { color: var(--text-secondary); font-weight: 700; }
.gantt-bar.kind-folder .gantt-bar-icon, .gantt-bar.kind-folder .gantt-bar-chevron { color: var(--text-muted); }

/* ============================================================
   PLANIFICADOR (tarjetas por periodo)
   ============================================================ */
.planner-header {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card); padding: 12px 16px; margin-bottom: 16px;
}
.planner-header-q { font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.planner-header-pill, .planner-current-pill {
  font-size: 9px; letter-spacing: .06em; border-radius: var(--r-pill); padding: 2px 8px;
  background: var(--primary-soft); color: var(--primary);
}
.planner-header-range { font-size: 12px; color: var(--text-muted); }
.planner-nav-btn {
  padding: 0 12px; height: 32px; font-size: 12.5px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--card); color: var(--text-secondary); box-shadow: var(--shadow-xs);
}
.planner-nav-btn:hover { background: var(--bg-subtle); border-color: var(--line-strong); color: var(--text); }
.planner-nav-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.planner-nav-btn.primary:hover { background: var(--primary-hover); }
.planner-row { gap: 16px; padding-bottom: 12px; }
.planner-row::-webkit-scrollbar { height: 10px; }
.planner-row::-webkit-scrollbar-track { background: transparent; }
.planner-row::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 5px; }

.planner-card { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--card); box-shadow: var(--shadow-card); }
.planner-card.is-current { border-color: var(--primary-light); box-shadow: 0 0 0 3px rgba(10, 20, 28, .08), var(--shadow-card); }
.planner-card-header { padding: 12px 16px; background: var(--card); border-bottom: 1px solid var(--line-soft); }
.planner-card.is-current .planner-card-header { background: var(--primary-soft); }
.planner-card-title { font-size: 14px; font-weight: 800; }
.planner-card-q { font-size: 10px; letter-spacing: .05em; border-radius: var(--r-pill); padding: 2px 8px; background: var(--bg-subtle); border-color: var(--line); }
.planner-card.is-current .planner-card-q { border-color: var(--primary-light); }
.planner-period-bar { background: var(--card-soft); border-bottom: 1px solid var(--line); }
.planner-period-label { font-size: 10px; letter-spacing: .06em; padding: 6px 8px; border-right: 1px solid var(--line-soft); }
.planner-period-label.is-current { background: var(--primary-soft); color: var(--primary); }
.planner-empty { color: var(--text-muted); font-size: 12px; }

.planner-phase-header {
  font-size: 10px; letter-spacing: .06em; color: var(--text-muted);
  background: var(--card-soft); border-bottom: 1px solid var(--line-soft); padding: 6px 14px 5px;
}
.planner-phase-icon { border-radius: 5px; background: var(--bg-subtle); color: var(--text-muted); }
.planner-phase-toggle { border-radius: 4px; color: var(--text-faint); }
.planner-phase-toggle:hover { background: var(--bg-hover); color: var(--text); }
.planner-timeline { background: transparent; }
.planner-timeline-grid-cell { border-right: 1px solid var(--line-soft); }
.planner-timeline-grid-cell.is-current { background: rgba(10, 20, 28, 0.035); }

/* Tarjetas posicionadas: mismo lenguaje que las barras del gantt */
.planner-card-item { border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--card); }
.planner-card-item:hover { box-shadow: var(--shadow-md); }
.planner-card-item.dragging { box-shadow: var(--shadow-lg); }
.planner-card-item.kind-objective { background: var(--warn-soft); border-color: var(--warn-line); border-left: 3px solid var(--accent-orange); }
.planner-card-item.kind-goal { background: var(--violet-soft); border-color: #ddd6fe; border-left: 3px solid #7c3aed; }
.planner-card-item.kind-strategy { background: var(--primary-soft); border-color: var(--primary-light); border-left: 3px solid var(--primary); }
.planner-card-item.status-blocked { background: var(--bad-soft); border-color: var(--bad-line); border-left: 3px solid var(--bad); }
.planner-card-item-head { font-size: 11px; font-weight: 600; color: var(--text); }
.planner-card-item-icon { border-radius: 4px; }
.planner-card-item-icon.kind-objective { background: rgba(217, 119, 6, .16); color: var(--warn); }
.planner-card-item-icon.kind-goal { background: rgba(124, 58, 237, .14); color: var(--violet); }
.planner-card-item-icon.kind-strategy { background: rgba(10, 20, 28, .14); color: var(--primary); }
.planner-card-item-range { font-size: 9.5px; font-style: normal; color: var(--text-muted); }
.planner-card-item-kpi-name { font-size: 9.5px; }
.planner-card-item-kpi-bar { background: rgba(255, 255, 255, .8); border-radius: var(--r-pill); }
.planner-card-item-kpi-bar > div { background: var(--primary); border-radius: var(--r-pill); }
.planner-card-item-kpi-bar > div.over { background: var(--ok); }
.planner-card-item-kpi-bar > div.low { background: var(--bad); }
.planner-card-item-kpi-pct { color: var(--text-secondary); }
.planner-toggle { border-radius: 4px; }
.planner-toggle:hover { background: rgba(0, 0, 0, .06); }

/* ============================================================
   AGENDA — tarjeta, cabecera y controles
   ============================================================ */
.agenda-section {
  margin-top: 16px; background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-card);
}
.agenda-header { padding: 14px 18px; background: var(--card); border-bottom: 1px solid var(--line-soft); gap: 14px; }
.agenda-title-wrap { gap: 12px; }
.agenda-icon { width: 34px; height: 34px; border-radius: var(--r-md); background: var(--primary-soft); color: var(--primary); }
.agenda-icon svg { width: 16px; height: 16px; }
.agenda-title { font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
.agenda-subtitle { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.agenda-controls { gap: 10px; }
/* Días / Horas: segmented control */
.agenda-toggle { background: var(--bg-subtle); border: 1px solid var(--line); border-radius: var(--r-md); padding: 3px; }
.agenda-toggle-btn { padding: 5px 12px; font-size: 12px; border-radius: 5px; color: var(--text-muted); font-family: inherit; }
.agenda-toggle-btn:hover { color: var(--text); background: rgba(255, 255, 255, .6); }
.agenda-toggle-btn.active { background: var(--card); color: var(--primary); box-shadow: var(--shadow-sm); }
.agenda-week-nav { gap: 6px; }
.agenda-nav-btn {
  height: 32px; padding: 0 12px; font-size: 12.5px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--card); color: var(--text-secondary);
  box-shadow: var(--shadow-xs); font-family: inherit; transition: background .12s, border-color .12s, color .12s;
}
.agenda-nav-btn:hover { background: var(--bg-subtle); border-color: var(--line-strong); color: var(--text); }
.agenda-nav-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.agenda-nav-btn.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); color: #fff; }
.agenda-nav-btn svg { width: 12px; height: 12px; stroke-width: 2.4; }
.agenda-week-label { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- Vista Días ---------- */
.agenda-days-grid { border-top: 1px solid var(--line-soft); }
.agenda-week-hcell { background: var(--card-soft); border-bottom: 1px solid var(--line); border-right: 1px solid var(--line-soft); padding: 10px 10px 9px; }
.agenda-week-hcell.is-today { background: var(--primary-soft); }
.agenda-day-name { font-size: 10.5px; letter-spacing: .08em; color: var(--text-muted); }
.agenda-day-num { font-size: 20px; font-weight: 800; letter-spacing: -.02em; margin-top: 3px; }
.agenda-day-num.is-other-month { color: var(--text-faint); }
.agenda-day-count { font-size: 10px; color: var(--text-muted); margin-top: 4px; }

.agenda-day-col { border-right: 1px solid var(--line-soft); }
.agenda-day-col.is-today { background: rgba(10, 20, 28, 0.035); }
.agenda-day-col.drag-over { background: rgba(10, 20, 28, 0.08); }
.agenda-day-body { padding: 8px 8px 14px; gap: 6px; }
.agenda-day-empty { font-size: 11px; font-style: normal; color: var(--text-faint); padding: 18px 4px; }

/* Grupos por carpeta/cliente */
.agenda-phase-header {
  font-size: 9.5px; letter-spacing: .06em; color: var(--text-muted);
  border-bottom: 1px solid var(--line-soft); padding: 6px 4px 5px; margin-bottom: 5px;
}
.agenda-phase-tasks { gap: 6px; }
.agenda-phase-client span {
  font-size: 9px; letter-spacing: .02em; padding: 2px 8px;
  background: var(--primary-soft); color: var(--primary);
}

/* Tarjeta de tarea (borde izquierdo de color, como los eventos de la referencia) */
.agenda-task {
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--primary);
  border-radius: var(--r-md); padding: 8px 10px; gap: 3px;
  box-shadow: var(--shadow-xs);
  transition: box-shadow .15s, opacity .15s, border-color .15s;
}
.agenda-task:hover { box-shadow: var(--shadow-md); border-color: var(--line-strong); }
.agenda-task.done { opacity: .6; border-left-color: var(--ok); }
.agenda-task-row { gap: 7px; }
.agenda-task-check { width: 15px; height: 15px; border: 1.5px solid var(--line-strong); }
.agenda-task-check:hover { border-color: var(--primary); }
.agenda-task.done .agenda-task-check { background: var(--ok); border-color: var(--ok); }
.agenda-task-leadicon { background: var(--pink-soft); color: var(--pink); }
.agenda-task-name { font-size: 12px; font-weight: 600; line-height: 1.3; }
.agenda-task-meta { font-size: 10px; margin-top: 3px; gap: 6px; }
.agenda-task-time { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: var(--r-xs); background: var(--primary-soft); color: var(--primary); }
.agenda-task-parent { font-size: 10px; color: var(--text-muted); }

/* Apuntes de contabilidad y franjas (ingresos/gastos) */
.agenda-cont {
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--text-muted);
  border-radius: var(--r-md); padding: 8px 10px; gap: 2px; box-shadow: var(--shadow-xs);
}
.agenda-cont:hover { box-shadow: var(--shadow-md); }
.agenda-cont.ingreso { background: var(--ok-soft); border-color: var(--ok-line); border-left-color: var(--ok); }
.agenda-cont.gasto { background: var(--bad-soft); border-color: var(--bad-line); border-left-color: var(--bad); }
.agenda-cont.done { background: var(--card-soft); border-color: var(--line); border-left-color: var(--text-faint); }
.agenda-cont-amt { font-size: 12.5px; }
.agenda-cont.ingreso .agenda-cont-amt { color: var(--ok); }
.agenda-cont.gasto .agenda-cont-amt { color: var(--bad); }
.agenda-cont-name { font-size: 12px; }
.agenda-cont-meta { font-size: 10px; }
.agenda-cont-limit, .agenda-band-limit {
  font-size: 8.5px; letter-spacing: .05em; color: var(--warn); background: var(--warn-soft);
  border-radius: var(--r-pill); padding: 1px 6px;
}

.agenda-band-lane { background: var(--card-soft); border-bottom: 1px solid var(--line-soft); padding: 6px 0; gap: 4px 0; }
.agenda-band { border-radius: var(--r-sm); margin: 0 4px; padding: 3px 10px; border: 1px solid var(--line); box-shadow: var(--shadow-xs); }
.agenda-band:hover { box-shadow: var(--shadow-md); }
.agenda-band.ingreso { background: var(--ok-soft); border-color: var(--ok-line); border-left: 3px solid var(--ok); }
.agenda-band.gasto { background: var(--bad-soft); border-color: var(--bad-line); border-left: 3px solid var(--bad); }
.agenda-band.ingreso .agenda-band-amt { color: var(--ok); }
.agenda-band.gasto .agenda-band-amt { color: var(--bad); }
.agenda-band-name { font-size: 11.5px; }
.agenda-band-cat { font-size: 10px; }

/* ---------- Vista Horas ---------- */
.agenda-hours-wrap { border-top: 1px solid var(--line-soft); }
.agenda-hours-corner, .agenda-hours-dayhead {
  background: var(--card-soft); border-bottom: 1px solid var(--line); border-right: 1px solid var(--line-soft);
}
.agenda-hours-dayhead.is-today { background: var(--primary-soft); }
.agenda-hours-labels { background: var(--card-soft); border-right: 1px solid var(--line); }
.agenda-hours-label { font-size: 9.5px; color: var(--text-muted); right: 6px; }
.agenda-hours-col { border-right: 1px solid var(--line-soft); }
.agenda-hours-col.is-today { background: rgba(10, 20, 28, 0.035); }
.agenda-hours-col.drag-over { background: rgba(10, 20, 28, 0.08); }
.agenda-hours-slot { border-bottom: 1px solid var(--line-soft); }
.agenda-hours-slot.half { border-bottom: 1px dashed rgba(20, 40, 45, 0.06); }
.agenda-now-line { background: var(--bad); }
.agenda-now-line::before { background: var(--bad); box-shadow: 0 0 0 2px #fff; }

.agenda-hour-task {
  background: var(--primary-soft); border: 1px solid var(--primary-light); box-shadow: inset 3px 0 0 var(--primary);
  border-radius: var(--r-sm); padding: 4px 7px; color: var(--primary);
}
.agenda-hour-task:hover { box-shadow: 0 3px 10px rgba(10, 20, 28, .18); }
.agenda-hour-task.done { background: var(--ok-soft); border-color: var(--ok-line); border-left-color: var(--ok); color: var(--ok); }
.agenda-hour-task.is-lead { background: var(--pink-soft); border-color: #fbcfe8; color: #831843; }
.agenda-hour-task-name { font-size: 10.5px; }
.agenda-hour-task-bc { font-style: normal; font-size: 9px; }
.agenda-hour-task-resize:hover { background: rgba(10, 20, 28, .18); }
.agenda-hour-task-leadicon { background: rgba(255, 255, 255, .7); }

.agenda-notime-zone { background: var(--card); border-bottom: 1px solid var(--line); }
.agenda-notime-label { background: var(--card-soft); border-right: 1px solid var(--line); font-size: 9px; letter-spacing: .06em; }
.agenda-notime-cell { border-right: 1px solid var(--line-soft); padding: 5px; gap: 4px; }
.agenda-notime-cell.is-today { background: rgba(10, 20, 28, 0.035); }
.agenda-notime-cell.drag-over { background: rgba(10, 20, 28, 0.08); }
.agenda-notime-task {
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--text-faint);
  border-radius: var(--r-sm); padding: 5px 7px; box-shadow: var(--shadow-xs);
}
.agenda-notime-task:hover { box-shadow: var(--shadow-md); }
.agenda-notime-task.done { border-left-color: var(--ok); }
.agenda-notime-task-bc { font-style: normal; }

/* Insignia de hora en la Tabla */
.date-time-badge {
  font-size: 10.5px; font-weight: 600; color: var(--text-secondary);
  background: var(--bg-subtle); border: 1px solid var(--line-soft);
  padding: 1px 7px; border-radius: var(--r-pill);
}

/* ============================================================
   DASHBOARD
   ============================================================ */
.dashboard-shell { padding: 20px 24px 40px; }
.dash-header { margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.dash-title-icon { width: 38px; height: 38px; border-radius: var(--r-md); background: var(--primary-soft); color: var(--primary); }
.dash-title, .dash-year-label, .dash-mini-header .dash-title {
  font-family: inherit; font-size: 20px; font-weight: 800; letter-spacing: -.02em; color: var(--text);
}
.dash-subtitle, .dash-mini-header .dash-subtitle { font-size: 13px; color: var(--text-muted); margin-top: 3px; }
.dash-year-label { font-size: 14px; }
.dash-year-nav { gap: 6px; }

/* Sección por proyecto: tarjeta blanca */
.dash-project-section {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card); margin-bottom: 16px;
}
.dash-project-header { padding: 12px 16px; background: var(--card); border-bottom: 1px solid var(--line-soft); gap: 12px; }
.dash-project-badge { width: 26px; height: 26px; border-radius: 5px; font-size: 11px; font-weight: 800; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .18); }
.dash-project-name { font-size: 14px; font-weight: 800; letter-spacing: -.01em; }
.dash-q-header {
  font-size: 11px; font-weight: 600; color: var(--text-muted);
  background: var(--bg-subtle); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 3px 10px;
}
.dash-q-header.is-current { color: var(--primary); border-color: var(--primary-light); background: var(--primary-soft); }
.dash-q-header .planner-header-pill { background: var(--primary); color: #fff; border-radius: var(--r-pill); padding: 1px 6px; }
.dash-q-range { font-size: 10.5px; font-style: normal; color: var(--text-faint); }
.dash-q-row::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 5px; }
.dash-q-row::-webkit-scrollbar-track { background: transparent; }

/* Agenda global del dashboard */
.dash-agenda { margin-top: 16px; }
.dash-agenda .agenda-header { background: var(--card); border-radius: var(--r-lg) var(--r-lg) 0 0; }
.dash-agenda .agenda-day-header { background: var(--card-soft); border-bottom: 1px solid var(--line); padding: 10px 10px 9px; }
.dash-agenda .agenda-day-col.is-today .agenda-day-header { background: var(--primary-soft); }
.dash-agenda-proj-head { font-size: 9.5px; letter-spacing: .06em; color: var(--text-muted); padding: 6px 4px 4px; }
.dash-agenda-proj-dot { width: 8px; height: 8px; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--line-soft); }
/* Las tarjetas del dashboard llevan color de proyecto inline (fondo + borde
   izquierdo): se respeta y solo se afina la forma */
.dash-agenda-task { border-radius: var(--r-md); }
.dash-agenda-task .agenda-task-time { font-size: 10px; border-radius: var(--r-xs); padding: 2px 6px; }