/*
 * css/components/layer-activity.css — Ventana "Actividad mensual / diaria" por capa (js/views/layer-activity.js).
 *
 * 18-oct, pedido del usuario. Usa el overlay/panel del calendario (calendar.css) y el color de la capa (--lc/--lbg).
 * Criterios de docs/Dashboard_style_*.md §10: letra mínima 12 px, números a la derecha en monoespaciada, tablas que
 * se deslizan dentro de su caja, encabezado fijo.
 */
.cal-panel.la-panel { max-width: 1240px; }
.la-summary { color: var(--text-dim); font-size: 0.8rem; }

/* calendario: una fila por mes -> nombre | 31 celdas (el día 1 siempre en la 1.ª columna) | total */
.la-cal-scroll { overflow-x: auto; }
.la-grid { display: grid; gap: 4px; min-width: 640px; }
.la-row { display: grid; grid-template-columns: 130px 1fr 120px; align-items: center; gap: 10px; }
.la-mname { font-size: 0.8rem; font-weight: 600; white-space: nowrap; }
.la-cells { display: grid; grid-template-columns: repeat(31, minmax(10px, 1fr)); gap: 2px; }
.la-cell { aspect-ratio: 1; border-radius: 3px; background: var(--surface-2); }
.la-cell.blank { background: transparent; }
.la-cell.out { opacity: 0.35; }
.la-cell.today { outline: 2px solid var(--text); outline-offset: -1px; }
.la-cell[data-level="1"] { background: color-mix(in srgb, var(--lc) 25%, var(--lbg)); }
.la-cell[data-level="2"] { background: color-mix(in srgb, var(--lc) 50%, var(--lbg)); }
.la-cell[data-level="3"] { background: color-mix(in srgb, var(--lc) 75%, var(--lbg)); }
.la-cell[data-level="4"] { background: var(--lc); }
.la-mtotal { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 0.8rem; text-align: right; white-space: nowrap; }

/* tabla jerárquica mes -> día -> flota -> unidad: componente común css/components/tree-table.css (19-oct) */
#la-months { margin-top: 22px; }
.la-plotlist { color: var(--text-dim); font-family: var(--font); font-size: 0.75rem; }
.la-warn { color: var(--gold-text); font-weight: 600; }
.la-notes { margin-top: 16px; }
.cal-panel.bronze { --lct: var(--bronze-text); }
.cal-panel.silver { --lct: var(--silver-text); }
.cal-panel.gold   { --lct: var(--gold-text); }
