/* mantenimiento.css · Analizador de Entrenamientos (Ver 0.22; última modificación 0.34)
 * Pestaña «Mantenimiento» (tab-mantenimiento.js). Usa las variables de estilos.css.
 */
.maint-page.hidden { display: none; }
.maint-tab-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px;
  background: rgba(251,191,110,.18); color: var(--ink-amber, #fbbf6e);
  border: 1px solid rgba(251,191,110,.5); font: 700 .68rem var(--mono);
}
.maint-tab-badge.is-red { background: rgba(255,69,58,.16); color: var(--ink-red, #ff9fb5); border-color: rgba(255,69,58,.5); }
.maint-tab-badge.hidden { display: none; }
.maint-summary { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin: 4px 0 14px; }
.maint-counter-red strong { color: var(--ink-red, #ff9fb5); }
.maint-counter-amber strong { color: var(--ink-amber, #fbbf6e); }

.maint-bike {
  margin: 0 0 12px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--surface-hover, rgba(255,255,255,.025));
}
.maint-bike > summary {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
  padding: 14px 16px; cursor: pointer; list-style: none;
}
.maint-bike > summary::-webkit-details-marker { display: none; }
.maint-bike > summary::before { content: '▸'; color: var(--txt-faint); transition: transform .15s; }
.maint-bike[open] > summary::before { transform: rotate(90deg); }
.maint-bike-name { color: var(--txt); font: 700 .98rem var(--ui); }
.maint-bike-meta { color: var(--txt-faint); font: 600 .74rem var(--mono); flex: 0 1 auto; }
/* Ver 0.31: los avisos de la bici, justo detrás de sus km (visibles con la bici contraída). */
.maint-bike > summary .maint-chip { flex: none; }
.maint-bike-body { padding: 0 16px 14px; }
.maint-group { margin: 14px 0 6px; color: var(--txt-dim); font: 700 .74rem var(--ui); text-transform: uppercase; letter-spacing: .08em; }
.maint-group small { text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--txt-faint); margin-left: 6px; }

.maint-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.maint-table th { text-align: left; color: var(--txt-faint); font: 700 .64rem var(--ui); text-transform: uppercase; letter-spacing: .08em; padding: 6px 8px; border-bottom: 1px solid var(--line); }
.maint-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); color: var(--txt-mid, var(--txt)); vertical-align: middle; }
.maint-table .num { text-align: right; font-family: var(--mono); white-space: nowrap; }
.maint-table td small { display: block; color: var(--txt-faint); font-size: .7rem; margin-top: 2px; }
.maint-comp { color: var(--txt); font-weight: 600; white-space: nowrap; }
.maint-value { color: var(--txt); font-weight: 700; }
.maint-state { min-width: 190px; }
.maint-actions { white-space: nowrap; text-align: right; }
.maint-btn { padding: 5px 9px; font-size: .7rem; margin-left: 4px; }
.maint-deduced { display: inline-block; padding: 0 5px; border-radius: 6px; border: 1px dashed var(--line-strong); color: var(--txt-faint); font-size: .64rem; }
.maint-note { max-width: 360px; color: var(--txt-dim); }

.maint-chip { display: inline-block; padding: 3px 8px; border-radius: 8px; font: 700 .68rem var(--ui); white-space: nowrap; }
.maint-chip-ok { background: rgba(46,230,107,.10); color: var(--ink-green, #6be5bd); }
.maint-chip-amber { background: rgba(251,191,110,.14); color: var(--ink-amber, #fbbf6e); }
.maint-chip-red { background: rgba(255,69,58,.16); color: var(--ink-red, #ff9fb5); }
.maint-chip-none { background: var(--surface-raised, rgba(255,255,255,.05)); color: var(--txt-faint); }
.maint-bar { height: 4px; margin-top: 6px; border-radius: 2px; background: var(--line); overflow: hidden; max-width: 220px; }
.maint-bar span { display: block; height: 100%; background: var(--ink-green, #2ee66b); }
.maint-amber .maint-bar span { background: var(--ink-amber, #fbbf6e); }
.maint-red .maint-bar span { background: var(--ink-red, #ff453a); }
.maint-none .maint-bar span { background: var(--txt-faint); }

.maint-history, .maint-config, .maint-gearmap { margin-top: 12px; }
.maint-history > summary, .maint-config > summary, .maint-gearmap > summary { cursor: pointer; color: var(--txt-dim); font: 700 .76rem var(--ui); }
.maint-history .maint-btn { margin: 8px 0 0; }
.maint-config-body { padding: 10px 0 0; }
.maint-config-flags { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 10px; color: var(--txt-dim); font-size: .8rem; }
.maint-config-body .editor-field { margin-bottom: 10px; }
.maint-config-body .editor-field label { display: block; color: var(--txt-dim); font-size: .74rem; margin-bottom: 4px; }
.maint-config-body .editor-field input { width: 100%; }
.maint-th-table input { width: 110px; }
.maint-gearmap { padding: 12px 16px; border: 1px solid var(--line); border-radius: 14px; }
.maint-gear-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0; }
.maint-gear-row input { min-width: 280px; }

.maint-dialog .maint-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.maint-dialog .hidden { display: none; }

@media (max-width: 760px) {
  .maint-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .maint-actions { white-space: normal; }
}

/* Ver 0.23: historial desplegable por componente y comentario del último cambio. */
.maint-hist-toggle { display: inline-flex; align-items: center; gap: 6px; border: 0; padding: 0; background: none;
  color: var(--txt); font: 600 .8rem var(--ui); cursor: pointer; text-align: left; }
.maint-hist-toggle:hover { color: var(--cyan); }
.maint-hist-toggle:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 4px; }
.maint-hist-arrow { color: var(--txt-faint); font-size: .7rem; transition: transform .15s; }
.maint-row.is-open .maint-hist-arrow { transform: rotate(90deg); color: var(--cyan); }
.maint-hist-count { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 8px; background: var(--surface-raised, rgba(255,255,255,.06));
  color: var(--txt-faint); font: 600 .62rem var(--mono); text-align: center; }
.maint-row.is-open td { border-bottom-color: transparent; background: rgba(34,211,238,.04); }
.maint-hist-row > td { padding: 0 8px 10px 26px; background: rgba(34,211,238,.04); }
.maint-hist-table { font-size: .74rem; border: 1px solid var(--line); border-radius: 10px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
.maint-hist-table td, .maint-hist-table th { padding: 6px 8px; }
.maint-hist-table tr:last-child td { border-bottom: 0; }
.maint-hist-empty { margin: 4px 0 0; }
.maint-last { max-width: 380px; }
.maint-table td small.maint-last-note { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 380px; }
.maint-del { border: 0; background: none; color: var(--txt-faint); cursor: pointer; font-size: .8rem; padding: 2px 6px; border-radius: 6px; }
.maint-del:hover { color: var(--ink-red, #ff9fb5); background: rgba(255,69,58,.12); }

/* Ver 0.24: umbrales por disciplina y disciplina de cada bici / juego de ruedas. */
.maint-thresholds { margin-top: 12px; }
.maint-th-table th.maint-th-kind { text-align: center; color: var(--txt-dim); border-left: 1px solid var(--line); }
.maint-th-table thead tr:nth-child(2) th:nth-child(odd) { border-left: 1px solid var(--line); }
.maint-th-table input { width: 92px; }
.maint-config-flags select, .maint-config-body .editor-field label select { margin-left: 6px; padding: 4px 8px; font-size: .78rem; }
.maint-config-flags label { display: inline-flex; align-items: center; gap: 4px; }

/* Ver 0.25: editar intervenciones. */
.maint-row-tools { white-space: nowrap; text-align: right; }
.maint-edit { border: 0; background: none; color: var(--txt-faint); cursor: pointer; font-size: .8rem; padding: 2px 6px; border-radius: 6px; }
.maint-edit:hover { color: var(--cyan); background: rgba(34,211,238,.12); }

/* Ver 0.28: secciones, juego de ruedas en la etiqueta, ayuda del componente y peso. */
.maint-hist-toggle > span:not(.maint-hist-arrow):not(.maint-hist-count) { display: inline-flex; flex-direction: column; }
.maint-wheel-tag { display: block; color: var(--txt-faint); font-size: .66rem; font-weight: 500; margin-top: 1px; }
.maint-table td small.maint-hint { color: var(--txt-faint); font-size: .66rem; font-weight: 400; margin: 2px 0 0 16px; white-space: normal; }
.maint-multi-note { margin: 6px 0 0; }
.maint-config-flags input[type=number] { width: 84px; padding: 4px 8px; margin-left: 6px; font-size: .78rem; }
/* Mismas columnas en todas las secciones. */
.maint-main-table { table-layout: fixed; min-width: 900px; }
.maint-main-table col.c1 { width: 23%; }
.maint-main-table col.c2 { width: 31%; }
.maint-main-table col.c3 { width: 12%; }
.maint-main-table col.c4 { width: 17%; }
.maint-main-table col.c5 { width: 17%; }
.maint-main-table td.maint-last, .maint-main-table td.maint-last small.maint-last-note { max-width: none; overflow: hidden; text-overflow: ellipsis; }
.maint-config-body .editor-field label input.maint-wheel-weight { width: 84px; padding: 4px 8px; margin: 0 4px 0 6px; font-size: .78rem; display: inline-block; }

/* Ver 0.30: secciones contraíbles. */
.maint-section > summary.maint-group { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; padding: 4px 0; }
.maint-section > summary::-webkit-details-marker { display: none; }
.maint-section > summary::before { content: '▸'; color: var(--txt-faint); font-size: .7rem; transition: transform .15s; }
.maint-section[open] > summary::before { transform: rotate(90deg); }
.maint-section > summary:hover { color: var(--txt); }
.maint-sec-count { color: var(--txt-faint); font: 600 .62rem var(--mono); letter-spacing: 0; }
.maint-section > summary .maint-chip { text-transform: none; letter-spacing: 0; font-size: .62rem; padding: 2px 7px; }

/* Ver 0.32: resultado de las revisiones. */
.maint-result { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 6px; font-size: .64rem; font-weight: 700; }
.maint-result-bien { background: rgba(46,230,107,.10); color: var(--ink-green, #6be5bd); }
.maint-result-vigilar { background: rgba(251,191,110,.14); color: var(--ink-amber, #fbbf6e); }
.maint-result-cambiar { background: rgba(255,69,58,.16); color: var(--ink-red, #ff9fb5); }

/* Ver 0.33: alta de bicis y pestaña «Configuración» (tab-configuracion.js). */
.maint-addbike .editor-field { margin: 8px 0; }
.maint-addbike .editor-field label { display: block; color: var(--txt-dim); font-size: .74rem; margin-bottom: 4px; }
.maint-addbike .editor-field input[type=text] { width: 100%; }
#cfgPage .maint-gearmap { margin-top: 12px; }
#cfgPage .editor-field { margin: 8px 0; }
#cfgPage .editor-field label { display: block; color: var(--txt-dim); font-size: .74rem; margin-bottom: 4px; }
#cfgPage .editor-field input[type=text], #cfgPage .editor-field select, #cfgPage textarea { width: 100%; box-sizing: border-box; }
#cfgPage textarea { font-family: var(--mono); font-size: .76rem; }
#cfgPage .maint-table input[type=text] { width: 100%; box-sizing: border-box; }
#cfgPage .maint-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cfg-gear-list { display: flex; flex-wrap: wrap; gap: 6px; }
.cfg-gear-list .maint-btn { margin: 0; }
@media (max-width: 760px) { #cfgPage .maint-form-row { grid-template-columns: 1fr; } }
#cfgPage input[type=text], #cfgPage textarea, #cfgPage select,
.maint-addbike input[type=text], .maint-addbike select,
.maint-config-body input[type=text], .maint-config-body input[type=number], .maint-config-body select {
  padding: 7px 10px; border-radius: 8px; border: 1px solid var(--line-strong, #384863);
  background: var(--surface-inset, #090f20); color: var(--txt); font: 600 .8rem var(--ui);
}
#cfgPage textarea { font: 500 .76rem var(--mono); resize: vertical; }
#cfgPage input:focus-visible, #cfgPage textarea:focus-visible, #cfgPage select:focus-visible,
.maint-addbike input:focus-visible, .maint-config-body input:focus-visible { outline: 2px solid var(--cyan, #39a7ff); outline-offset: 1px; }
#cfgPage .maint-config-flags input[type=text] { width: auto; }

/* Ver 0.34: edición masiva de bicis (tab-configuracion.js) y ✎ de la tabla de bicis de Estadísticas. */
.cfg-bulk-modes { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 10px 0 4px; color: var(--txt-dim); font-size: .8rem; }
.cfg-bulk-modes label, .cfg-bulk-check { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.cfg-bulk-preview { margin: 10px 0 4px; padding: 10px 12px; border: 1px dashed var(--line-strong, #384863); border-radius: 10px;
  color: var(--txt-mid, var(--txt)); font-size: .8rem; line-height: 1.5; }
.cfg-bulk-preview:empty { display: none; }
.cfg-bulk-preview strong { color: var(--txt); }
.cfg-bulk-sample { display: block; margin-top: 6px; color: var(--txt-faint); font: 500 .72rem var(--mono); }
.cfg-bulk-error { color: var(--ink-amber, #fbbf6e); }
#cfgPage .cfg-bulk-check { color: var(--txt-dim); }
/* La celda del nombre es «sticky» y corta con «…»: el ✎ va superpuesto a la derecha para no quedar oculto. */
.stats-bike-edit { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border: 0; cursor: pointer; font-size: .78rem; padding: 2px 6px;
  border-radius: 6px; color: var(--txt-faint); background: var(--surface-inset, #101525); opacity: 0; transition: opacity .15s; }
tr:hover .stats-bike-edit, .stats-bike-edit:focus-visible { opacity: 1; }
.stats-bike-edit:hover { color: var(--cyan, #39a7ff); background: rgba(34,211,238,.12); }
#statsBikesBody td:first-child { position: sticky; left: 0; padding-right: 30px; } /* referencia del ✎ (ya es sticky en estilos.css) */
/* Ver 0.38: «Cambiar la modalidad por bici» (Edición masiva de bicis). */
.cfg-bulk-kind-table td.num { text-align: right; font-family: var(--mono); }
.cfg-bulk-kind-table select { padding: 5px 8px; font-size: .78rem; }
.cfg-bulk-kind-table tr.cfg-bulk-focus td { background: rgba(34,211,238,.08); }
#cfgBulkKindBox > .cfg-bulk-check { margin: 8px 0; }