/* Incidencias embarcados · complementos al diseño de Ataria */
:root { --warning-soft: #fff4e5; }
[data-theme="dark"] { --warning-soft: #35260f; --warning: #fbbf24; }

/* Menú lateral */
.sidebar .new-btn { width: 100%; }
.sidebar .brand.has-logo .brand-name { font-size: 13px; color: var(--sb-muted, var(--muted)); font-weight: 700; letter-spacing: .02em; }
.nav-badge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.sidebar-foot { font-size: 11.5px; justify-content: center; }
[hidden] { display: none !important; }

/* Aviso de notificaciones al entrar */
.notif-intro { border-left: 4px solid var(--primary); margin-bottom: 22px; }
.notif-intro .card-head { margin-bottom: 6px; }
.notif-intro .np-list { padding: 0; }
.notif-page .np-list { padding: 0; }
.notif-page .np-item { border-bottom: 1px solid var(--border); border-radius: 0; padding: 14px 10px; }
.notif-page li:last-child .np-item { border-bottom: 0; }

/* Ventana de confirmación */
.confirm-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--danger-soft); color: var(--danger); margin-bottom: 12px; }
.confirm-text { font-weight: 600; font-size: 15px; margin-bottom: 18px; }

/* Selector segmentado con radios (Sí / No, Ida / Vuelta) */
.radio-seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 8px; }
.radio-seg label { position: relative; cursor: pointer; }
.radio-seg input { position: absolute; opacity: 0; pointer-events: none; }
.radio-seg .opt { display: flex; flex-direction: column; justify-content: center; gap: 1px; min-height: 48px; padding: 8px 14px; border: 1.5px solid var(--border-strong); border-radius: 11px; background: var(--surface); font-weight: 700; font-size: 14px; color: var(--text-2); transition: border-color .15s, background .15s, color .15s; }
.radio-seg .opt small { font-weight: 600; color: var(--muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.radio-seg input:checked + .opt { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.radio-seg input:checked + .opt small { color: color-mix(in srgb, var(--primary) 70%, var(--text)); }
.radio-seg input:focus-visible + .opt { outline: 2px solid var(--primary); outline-offset: 2px; }
.radio-seg.danger input:checked + .opt.yes { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
.day-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 99px; background: var(--primary-soft); color: var(--primary); font-size: 12px; font-weight: 700; margin-left: auto; }
.form-section { padding-top: 18px; border-top: 1px dashed var(--border); }
.form-section:first-of-type { padding-top: 0; border-top: 0; }
.req { color: var(--danger); }
.inc-form { max-width: 920px; }
.inc-actions { max-width: 920px; margin-top: 16px; justify-content: space-between; }
.inc-actions .inc-submit { margin-left: auto; }

/* Ficha de incidencia */
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fact { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; min-width: 0; }
.fact small { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.fact strong { display: block; font-size: 15px; overflow-wrap: anywhere; }
.fact span { color: var(--text-2); font-size: 13px; }
.fact.alert-fact { background: var(--danger-soft); border-color: color-mix(in srgb, var(--danger) 25%, transparent); }
.fact.alert-fact strong { color: var(--danger); }
.desc-box { white-space: pre-wrap; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px; line-height: 1.6; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.timeline-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.timeline-list li { display: flex; gap: 10px; font-size: 13.5px; }
.timeline-list li .ico { color: var(--muted); margin-top: 2px; }

/* Listado */
.table td.num { font-variant-numeric: tabular-nums; }
.inc-code { font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; }
.inc-code:hover { color: var(--primary); }
.cell-sub { display: block; color: var(--muted); font-size: 12.5px; }
.cell-clip { max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.affect-dot { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: 12.5px; color: var(--danger); }
.affect-dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
/* Filtros: la misma barra en todas las pantallas. Campos en cuadrícula; a la derecha, el total y el botón «Filtrar» */
.toolbar.filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.toolbar.filters > * { flex: 1 1 180px; min-width: 0; }
.toolbar.filters .search-box { flex: 2 1 260px; }
.toolbar.filters select[name="linea"] { flex: 2 1 240px; }
.toolbar.filters select, .toolbar.filters input { width: 100%; min-width: 0; height: 38px; }
.toolbar.filters .field-inline { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.toolbar.filters .field-inline > span { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.toolbar.filters > .filter-total, .toolbar.filters > .btn { flex: 0 0 auto; }
.toolbar.filters > .filter-total { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; }
.toolbar.filters > .btn { height: 36px; padding: 0 14px; font-size: 13px; justify-content: center; white-space: nowrap; }
.toolbar.filters > .filter-total + .btn { margin-left: 10px; }
.toolbar.filters > .btn-primary { margin-left: auto; }

/* Maestros */
.master-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 20px; align-items: start; }
.master-grid .card.sticky { position: sticky; top: 80px; }
.master-grid.solo { grid-template-columns: minmax(0, 1fr); }
.color-sq { display: inline-block; width: 14px; height: 14px; border-radius: 4px; background: var(--c); vertical-align: -2px; }
.exp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.exp-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.exp-head .dir-ico { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); }
.exp-times { display: flex; flex-wrap: wrap; gap: 8px; }
.exp-time { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 6px 0 10px; border-radius: 9px; background: var(--surface-2); border: 1px solid var(--border); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 14px; }
.exp-time.off { opacity: .45; text-decoration: line-through; }
.exp-time small { font-weight: 600; color: var(--muted); font-size: 11.5px; }
.exp-time input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--danger); margin: 0; }
.tabs.day-tabs { margin-bottom: 18px; }

/* Panel de indicadores */
.kpi-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 700; margin-top: 3px; }
.kpi-delta.up { color: var(--danger); }
.kpi-delta.down { color: var(--success); }
.kpi-delta.flat { color: var(--muted); }
.ad-grid.even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ad-hbars li.clickable a { color: inherit; display: contents; }
.ad-hb-bar i.c { background: color-mix(in srgb, var(--c) 80%, var(--surface)); }
.ad-hb-bar i.lv4 { background: #dc2626; } .ad-hb-bar i.lv3 { background: #ea580c; } .ad-hb-bar i.lv2 { background: #2563eb; } .ad-hb-bar i.lv1 { background: #16a34a; }
.ad-hb-bar:hover i.c { background: var(--c); }
.ad-hbars .sub { font-size: 11.5px; color: var(--muted); margin-left: 4px; }
.split-bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden; background: var(--surface-2); border: 1px solid var(--border); margin: 8px 0 10px; }
.split-bar span { display: block; height: 100%; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--text-2); }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.legend b { color: var(--text); font-variant-numeric: tabular-nums; }
.heat { display: grid; grid-template-columns: 84px repeat(24, minmax(0, 1fr)) minmax(24px, 1.4fr); gap: 2px; font-size: 10.5px; color: var(--muted); align-items: center; }
.heat .hc { height: 22px; border-radius: 3px; background: color-mix(in srgb, var(--primary) calc(var(--v) * 100%), var(--surface-2)); }
.heat .hl { font-weight: 700; font-size: 11.5px; color: var(--text-2); }
.heat .hx { text-align: center; }
.heat .hs { margin-left: 6px; }
.dash-filters { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.dash-filters select[name="linea"] { flex-grow: 1; }
.dash-filters select { width: auto; height: 36px; }
.dash-filters select[name="linea"] { flex: 1 1 260px; min-width: 0; }

@media (max-width: 1180px) { .detail-grid, .master-grid { grid-template-columns: minmax(0, 1fr); } .master-grid .card.sticky { position: static; } }
@media (max-width: 900px) { .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ad-grid.even, .exp-cols { grid-template-columns: 1fr; } .heat { grid-template-columns: 54px repeat(24, minmax(0, 1fr)) minmax(22px, 1.4fr); } }
@media (max-width: 640px) { .facts { grid-template-columns: minmax(0, 1fr); } .radio-seg .opt { min-height: 44px; } .table.responsive thead { display: none; } .table.responsive td { display: block; border: 0; padding: 4px 16px; } .table.responsive tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--border); } .heat .hx:nth-child(odd) { visibility: hidden; } }
.ad-tiles { grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); }
.ad-hbars li { grid-template-columns: minmax(0, 15em) 1fr auto; }
.ad-dow-card .ad-hbars { gap: 2px; }
.ad-dow-card .ad-hbars li { height: 22px; font-size: 11.5px; grid-template-columns: 84px 1fr auto; }
.ad-dow-card .ad-hb-name { font-weight: 700; color: var(--text-2); }
.ad-dow-head { height: 17px; margin-bottom: 2px; }
@media (max-width: 640px) { .ad-hbars li { grid-template-columns: minmax(0, 9em) 1fr auto; } }
.dash-filters .seg { max-width: 100%; overflow-x: auto; }
@media (max-width: 560px) { .ad-tiles { grid-template-columns: 1fr 1fr; } .dash-filters, .dash-filters select { width: 100%; } }

/* Idioma en la barra superior y campos bilingües */
.top-lang { margin: 0 6px 0 0; }
.top-lang a { padding: 3px 9px; font-size: 12px; }
@media (max-width: 900px) { .top-lang { display: none; } }
.bi-field { display: grid; gap: 6px; }
.bi-row { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; align-items: center; }
.bi-row .lang-tag { height: 42px; }
.ne-help { display: flex; align-items: center; gap: 6px; }
.notif-admin .radio-list { display: grid; gap: 8px; }
.pick-list { max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; padding: 6px 10px; display: grid; gap: 2px; margin-top: 8px; }
.pick-item { padding: 6px 2px; }
.pick-item[hidden] { display: none; }
.na-list { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.na-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; }
.na-list li .ico { color: var(--k, var(--primary)); margin-top: 2px; }
.na-h { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 12px 0 8px; }
.switch-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-top: 1px solid var(--border); }
.switch-row:first-of-type { border-top: 0; }
.switch-row > div { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.switch-row small { color: var(--muted); font-size: 12.5px; }
.ch-pills { display: flex; gap: 8px; flex-wrap: wrap; }
.ch-pill { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border: 1.5px solid var(--border-strong); border-radius: 99px; font-size: 13px; font-weight: 700; color: var(--text-2); cursor: pointer; }
.ch-pill:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.ch-pill input { accent-color: var(--primary); }

/* Formularios de los maestros en ventana (como en Ataria) */
body:has(.modal-wrap) { overflow: hidden; }
.modal-wrap { place-items: start center; overscroll-behavior: contain; }
.modal-wrap > .modal { margin: auto 0; max-width: min(680px, 100%); }
.modal-wrap > .modal.narrow { max-width: min(480px, 100%); }
.modal .card-head h2 { margin: 0; font-size: 18px; }

/* Alta y edición en página propia, con «volver» (como la ficha de usuario de Ataria) */
.form-head .back-link { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 10px; }
.form-head .back-link:hover { color: var(--primary); }
.form-head h1 { margin: 0; }
.form-head p { margin: 4px 0 0; }
.form-page { max-width: 820px; }
.form-page > .form > .card { margin: 0; display: flex; flex-direction: column; gap: 16px; }
.uf-actions { margin-top: 18px; padding: 14px 0; border-top: 1px solid var(--border); position: sticky; bottom: 0; background: var(--bg); z-index: 3; }

/* Pestañas verticales en formularios largos */
.form-page.has-tabs { max-width: 980px; }
.ftabs-layout { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 22px; align-items: start; }
.ftabs { position: sticky; top: 16px; display: flex; flex-direction: column; gap: 4px; padding: 6px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.ftab { appearance: none; border: 0; background: transparent; color: var(--muted); text-align: left; font: inherit; font-size: 14px; font-weight: 700; padding: 10px 12px; border-radius: 8px; cursor: pointer; }
.ftab:hover { background: var(--primary-soft, rgba(0,0,0,.04)); color: var(--text); }
.ftab[aria-selected="true"] { background: var(--primary-soft, rgba(0,0,0,.06)); color: var(--primary); }
.ftab:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.ftabs-body { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ftabs-body > .card[hidden] { display: none !important; }
.ftabs-body > .card { margin: 0; display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 700px) {
  .ftabs-layout { grid-template-columns: 1fr; }
  .ftabs { position: static; flex-direction: row; overflow-x: auto; }
  .ftab { white-space: nowrap; }
}

/* Expediciones dentro de la ficha de línea (solo lectura) */
.lin-exp-day { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 3px solid var(--border); }
.lin-exp-day:first-of-type { padding-top: 0; border-top: 0; }
.lin-exp-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; align-items: start; }
.lin-exp-row + .lin-exp-row { padding-top: 10px; border-top: 1px dashed var(--border); }
.lin-exp-dir { display: flex; flex-direction: column; gap: 2px; }
.lin-exp-row .exp-times { gap: 6px; }
.lin-exp-row .exp-time { height: 28px; font-size: 13px; padding: 0 8px; }
@media (max-width: 700px) { .lin-exp-row { grid-template-columns: 1fr; gap: 4px; } }
/* Expediciones de ida y vuelta: color configurable en Ajustes → Apariencia */
.exp-time.exp-dir { background: var(--exp); border-color: var(--exp); color: #fff; }
.exp-time.exp-dir small { color: #fff; opacity: .9; }

/* Pasos del formulario de incidencia: pestañas horizontales */
[data-fpanel][hidden] { display: none !important; }
.ftabs-layout.ftabs-h { display: flex; flex-direction: column; gap: 18px; align-items: stretch; }
.ftabs-h .ftabs { position: static; flex-direction: row; overflow-x: auto; gap: 6px; padding: 6px; border-radius: 12px; }
.ftabs-h .ftab { white-space: nowrap; }
.ftabs-h .ftabs-body { display: block; }
.ftabs-h .form-section { padding-top: 0; border-top: 0; }
.step-note { margin: 0 0 12px; min-height: 0; }
.step-note:empty { display: none; }

/* Causas múltiples en el formulario de incidencia */
.causas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px 16px; }
.causa-opt { padding: 6px 0; align-items: flex-start; }
.causa-opt input { margin-top: 3px; }

/* Listado de incidencias: fila pulsable y columna de acciones */
.inc-row { cursor: pointer; }
.row-actions-head { width: 1%; }
.row-actions { white-space: nowrap; text-align: right; }
.row-actions .btn { margin-left: 4px; }
.row-actions .btn-icon { width: 34px; padding: 0; justify-content: center; }
.row-actions-head, .row-actions { position: sticky; right: 0; background: var(--surface); box-shadow: -8px 0 8px -8px rgba(0,0,0,.12); }
.row-actions-head { background: var(--surface-2); }

/* Ficha: quién y cuándo registró la incidencia, bajo el título */
.head-sub { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 13px; color: var(--muted); }
.head-sub strong { color: var(--text); font-weight: 600; }
.head-sub svg { flex-shrink: 0; }

/* Envío a grupos externos */
.tag.tag-sent { background: var(--success-soft); color: var(--success); border-color: transparent; }
.tag.tag-unsent { color: var(--muted); }
.head-warn { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 13px; color: #c2410c; }
[data-theme="dark"] .head-warn { color: #fdba74; }
.head-warn svg { flex-shrink: 0; }
.cm-form { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.send-groups { width: 100%; display: flex; flex-direction: column; gap: 8px; text-align: left; margin-top: 4px; max-height: 300px; overflow-y: auto; }
.send-group { align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }
.send-group input { margin-top: 3px; }
.send-group > span { display: flex; flex-direction: column; gap: 2px; }
.send-group small { font-size: 12.5px; }
.send-group:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.cmodal .hint { text-align: left; width: 100%; }

/* Asistente de nueva incidencia */
.inc-actions .wiz-nav { display: flex; gap: 10px; margin-left: auto; }
@media (max-width: 520px) { .inc-actions { flex-wrap: wrap; } .inc-actions .wiz-nav { width: 100%; } .inc-actions .wiz-nav .btn { flex: 1; justify-content: center; } }

/* Panel: evolución a ancho completo; día de la semana y franja horaria juntos; pendientes a ancho completo */
.ad-grid.solo { grid-template-columns: minmax(0, 1fr); }
.ad-dow-card { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
@media (max-width: 900px) { .ad-dow-card { grid-template-columns: 1fr; } }

/* Franja horaria: intensidad de rojo (más) a verde (menos) */
.heat .hc.lv4 { background: #dc2626; }
.heat .hc.lv3 { background: #ea580c; }
.heat .hc.lv2 { background: #2563eb; }
.heat .hc.lv1 { background: #16a34a; }
.heat-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; font-size: 12.5px; color: var(--muted); }
.heat-legend span { display: inline-flex; align-items: center; gap: 6px; }
.heat-legend i { width: 14px; height: 14px; border-radius: 3px; background: var(--surface-2); display: inline-block; }
.heat-legend i.lv4 { background: #dc2626; } .heat-legend i.lv3 { background: #ea580c; } .heat-legend i.lv2 { background: #2563eb; } .heat-legend i.lv1 { background: #16a34a; }

/* Una sola tarjeta: días a la izquierda, franja a la derecha, separadas por una línea */
.ad-dow-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.ad-dow-left { padding-right: 18px; border-right: 1px solid var(--border); min-width: 0; }
.ad-dow-right { padding-left: 18px; min-width: 0; }
@media (max-width: 900px) {
  .ad-dow-wrap { grid-template-columns: minmax(0, 1fr); }
  .ad-dow-left { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--border); padding-bottom: 14px; margin-bottom: 14px; }
  .ad-dow-right { padding-left: 0; }
}

/* ==========================================================================
   Móvil primero · ajustes responsive
   ========================================================================== */

/* Pestañas genéricas: nunca ensanchan la página; se desplazan dentro de su caja */
.tabs { overflow-x: auto; flex-wrap: nowrap; max-width: 100%; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { white-space: nowrap; flex: 0 0 auto; }

/* Botón «Filtros» (solo móvil) */
.filters-toggle { display: none; }

/* Tablas de administración: tarjetas en móvil (las etiquetas las pone app.js) */
@media (max-width: 640px) {
  .table.stack, .table.stack tbody { display: block; width: 100%; }
  .table.stack thead { display: none; }
  .table.stack tr { display: block; padding: 10px 16px; border-bottom: 1px solid var(--border); }
  .table.stack td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 5px 0; border: 0; text-align: right; min-width: 0; }
  .table.stack td::before { content: attr(data-label); flex: 0 0 38%; max-width: 38%; text-align: left; font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
  .table.stack td:first-child, .table.stack td.empty-row { display: block; text-align: left; padding-top: 2px; }
  .table.stack td:first-child::before, .table.stack td[data-label=""]::before, .table.stack td.empty-row::before { display: none; }
  .table.stack td.actions { justify-content: flex-end; padding-top: 8px; }
  .table.stack td .cell-clip { max-width: 100% !important; }
}

/* Zonas táctiles: mínimo ~40 px */
@media (max-width: 768px), (pointer: coarse) {
  .btn-sm { min-height: 38px; }
  .btn-icon, .icon-btn { min-width: 40px; min-height: 40px; }
  .dash-filters select { height: 40px; }
  .seg a, .seg button { min-height: 38px; display: inline-flex; align-items: center; }
}

/* Cabecera de página y acciones */
@media (max-width: 640px) {
  .page-head { flex-direction: column; align-items: stretch; gap: 12px; }
  .head-actions { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
  .head-actions .btn { flex: 1 1 calc(50% - 4px); justify-content: center; }
  .head-actions .btn-primary { flex-basis: 100%; }
}

/* Filtros: en móvil los campos ocupan el ancho; el botón «Filtrar» y el total siguen a la derecha. Incidencias los pliega tras «Filtros». */
@media (max-width: 700px) {
  .toolbar.filters { gap: 8px; }
  .toolbar.filters > * { flex: 1 1 100%; }
  .toolbar.filters > .filter-total, .toolbar.filters > .btn { flex: 0 0 auto; }
  .toolbar.filters .search-box { flex: 1 1 100%; }
  .filters-toggle { display: inline-flex; align-items: center; gap: 6px; height: 36px; }
  .filters-toggle .count { background: var(--primary); color: #fff; border-radius: 99px; padding: 0 7px; font-size: 11.5px; line-height: 18px; }
  .toolbar.filters.collapsible:not(.open) > :not(.search-box):not(.filters-toggle) { display: none; }
  .toolbar.filters.collapsible.open > * { flex: 1 1 calc(50% - 4px); }
  .toolbar.filters.collapsible.open > .search-box { flex: 1 1 100%; }
  .toolbar.filters.collapsible.open > .filters-toggle, .toolbar.filters.collapsible.open > .filter-total, .toolbar.filters.collapsible.open > .btn { flex: 0 0 auto; }
}
@media (max-width: 380px) { .toolbar.filters.collapsible.open > * { flex: 1 1 100%; } .toolbar.filters.collapsible.open > .filters-toggle, .toolbar.filters.collapsible.open > .filter-total, .toolbar.filters.collapsible.open > .btn { flex: 0 0 auto; } }

/* Pasos del asistente de nueva incidencia: tres columnas siempre visibles */
@media (max-width: 700px) {
  .ftabs-h .ftabs, .ftabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; overflow: visible; }
  .ftabs-h .ftab, .ftab { white-space: normal; text-align: center; font-size: 12.5px; line-height: 1.2; padding: 8px 4px; }
}

/* Mapa de calor del panel: si no cabe, se desplaza dentro de su caja */
@media (max-width: 640px) { .ad-dow-right { overflow-x: auto; } .ad-dow-right .heat { min-width: 560px; } }

/* El contenido nunca ensancha la página */
.page, main, .content { min-width: 0; }
img, svg, video { max-width: 100%; }