/* Traspaso Vehicular · V3.61 FIX92R34AX
   Pulido visual profesional basado en revisión móvil completa.
   Mantiene la identidad institucional y no altera reglas de negocio. */

:root {
  --touch-min: 46px;
  --mobile-gutter: 14px;
  --content-readable: 760px;
}

/* Legibilidad y ritmo general */
body { text-rendering: optimizeLegibility; }
.page-title, .modal-title { letter-spacing: -.015em; }
.text-muted, .field-help, .action-desc, .vcard-info { line-height: 1.42; }

.btn {
  min-height: var(--touch-min);
  border-radius: 12px;
  font-size: 14px;
  font-weight: 750;
}
.btn-sm { min-height: 40px; }
input, select, textarea { font-size: 14px; line-height: 1.35; }
textarea { min-height: 92px; }

/* Firma: mayor área útil, contraste y controles táctiles */
.sig-container {
  min-height: 190px;
  border: 2px dashed rgba(36,58,143,.30);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15,23,42,.07), inset 0 0 0 1px rgba(255,255,255,.8);
}
.sig-canvas { min-height: 190px; width: 100%; }
.sig-label {
  bottom: 12px;
  font-size: 12px;
  font-weight: 650;
  color: #64748b;
}
.sig-clear {
  top: 8px;
  right: 8px;
  min-width: 76px;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 750;
  color: #475569;
  background: rgba(255,255,255,.96);
  box-shadow: 0 5px 16px rgba(15,23,42,.08);
}
.permanente-signature-label {
  font-size: 12.5px !important;
  line-height: 1.35;
}

/* Esquema de daños: el contenido visual pasa a ser protagonista */
.schema-container {
  border: 2px solid rgba(36,58,143,.16);
  border-radius: 18px;
  padding: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15,23,42,.07);
}
.schema-img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  min-height: 0;
  max-height: none;
  object-fit: initial;
  object-position: initial;
}
.schema-tools,
.schema-tools[style] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 8px;
  margin: 8px 0 12px;
  align-items: stretch;
}
.schema-tools > span {
  grid-column: 1 / -1;
  font-size: 12px;
  color: var(--muted);
}
.damage-btn {
  display:flex;
  align-items:center;
  min-height: 44px;
  justify-content: center;
  padding: 8px 7px;
  border: 1.5px solid currentColor;
  border-radius: 11px;
  font-size: 12px;
  font-weight: 750;
  background: rgba(255,255,255,.86);
  opacity: .72;
}
.damage-btn.active {
  opacity: 1;
  background: #fff;
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 16%, transparent), 0 7px 18px rgba(15,23,42,.08);
}
.damage-session-actions { justify-content: space-between; }
.undo-damage-btn { min-height: 40px; }
.damage-help-text { font-size: 12.5px; line-height: 1.45; }
.damage-new-count { font-size: 12px; }

/* Checklist: menos bloques coloreados y mayor claridad de selección */
.checklist-grid { gap: 8px; }
.checklist-item {
  min-height: 54px;
  padding: 10px 12px;
  gap: 10px;
  background: rgba(255,255,255,.88);
  border-width: 1px 1px 1px 4px;
  border-color: rgba(148,163,184,.28);
  box-shadow: 0 4px 14px rgba(15,23,42,.025);
}
.checklist-item.estado-S { background: rgba(255,255,255,.92); border-color: #22c55e; }
.checklist-item.estado-D { background: rgba(255,255,255,.92); border-color: #ef4444; }
.checklist-item.estado-NA { background: rgba(255,255,255,.90); border-left-color: #94a3b8; }
.item-name { font-size: 13.5px; line-height: 1.34; font-weight: 600; }
.item-controls { gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.check-btn {
  min-width: 46px;
  min-height: 36px;
  padding: 6px 10px;
  border-radius: 9px;
  font-size: 11.5px;
}

/* Tarjetas de vehículo y acciones */
.vehicle-card { border-radius: 18px; }
.vehicle-card.selected { box-shadow: 0 0 0 2px rgba(36,58,143,.12), 0 14px 34px rgba(36,58,143,.11); }
.vcard-placa { font-size: 19px; }
.vcard-info { font-size: 13px; }
.vehicle-clear-btn { width: 40px; height: 40px; }
.action-card-btn { min-height: 68px; }
.action-title { font-size: 15.5px; }
.action-desc { font-size: 13px; }

/* Notificaciones: jerarquía y lectura rápida */
.notification-item { padding: 13px; gap: 11px; border-radius: 15px; }
.notification-body strong { font-size: 13.5px; line-height: 1.28; }
.notification-body span {
  font-size: 12.5px;
  line-height: 1.42;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.notification-body em { font-size: 11.5px; }
.notification-mark-all { min-height: 38px; padding-inline: 13px; }

/* Formularios: secciones más claras y aireadas */
.vehicle-form-section, .permanente-step-panel {
  border-color: rgba(148,163,184,.22);
  box-shadow: 0 8px 24px rgba(15,23,42,.045);
}
.section-mini-title { font-size: 12.5px; margin-bottom: 14px; }
.field label { font-size: 12px; line-height: 1.3; }
.field + .field { margin-top: 12px; }

/* Modales largos: usan mejor el viewport móvil */
.modal { box-shadow: 0 24px 60px rgba(15,23,42,.22); }
.modal-close-btn, .modal .btn-ghost.btn-sm { min-width: 42px; min-height: 42px; }
.modal-actions { gap: 10px; }

/* Perfil y resúmenes: valores largos respirables */
.profile-modal-shell, .modal-detail-shell { width: min(100%, 760px); }
.profile-row, .detail-row { line-height: 1.4; }

/* Navegación inferior y safe area */
.bottom-nav {
  min-height: 62px;
  padding-bottom: max(6px, env(safe-area-inset-bottom));
  box-shadow: 0 -8px 24px rgba(15,23,42,.06);
}
.bottom-nav button { min-height: 50px; }

@media (max-width: 700px) {
  body { font-size: 14px; }
  main { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }

  .page-title { font-size: 19px; }
  .modal-title { font-size: 18px; line-height: 1.22; }
  .text-muted { font-size: 12.5px; }

  .modal-overlay { padding: 10px 8px 0; }
  .modal-overlay > .modal,
  .modal-overlay > .modal-detail-shell,
  .modal-overlay > .profile-modal-shell {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 10px) !important;
    border-radius: 22px 22px 0 0 !important;
  }
  .modal { padding: 20px 16px max(16px, env(safe-area-inset-bottom)); }
  .modal-actions {
    position: sticky;
    bottom: 0;
    z-index: 4;
    padding-top: 10px;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.94) 24%);
  }

  .sig-container, .sig-canvas { min-height: 185px; }
  .sig-clear { min-width: 82px; }

  .schema-container { margin: 10px 0; padding: 6px; }
  .schema-tools,
  .schema-tools[style] { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .damage-btn { font-size: 12.5px; }
  .damage-btn { font-size: 12.5px; }

  .checklist-item {
    align-items: flex-start;
    flex-direction: column;
    padding: 11px 12px;
  }
  .item-name { width: 100%; font-size: 14px; }
  .item-controls { width: 100%; display: grid; grid-template-columns: repeat(3,1fr); }
  .check-btn { width: 100%; min-height: 39px; }

  .vehicle-grid { grid-template-columns: 1fr; }
  .vehicle-card { padding: 14px; }
  .vrc-thumb { height: 145px; }
  .schema-thumb { width: 116px; height: 82px; }

  .notification-panel-head { padding: 15px 14px 12px; }
  .notification-list { max-height: min(64dvh, 520px); padding: 8px; }
  .notification-item { padding: 13px 12px; }

  .vehicle-modal-body { padding: 15px 14px 70px; }
  .vehicle-form-section { padding: 14px 12px; }
  .vehicle-modal-actions { padding: 12px 14px max(14px, env(safe-area-inset-bottom)); }
}

@media (max-width: 380px) {
  .sig-container, .sig-canvas { min-height: 168px; }
  .damage-btn { font-size: 12px; }
  .item-controls { gap: 5px; }
  .check-btn { padding-inline: 6px; }
}

@media (min-width: 900px) {
  .sig-container, .sig-canvas { min-height: 220px; }
  .schema-container { max-width: 760px; margin-inline: auto; }
}


/* Fase 2 parcial: formularios largos más claros en móvil */
@media (max-width: 700px) {
  .section-header {
    position: sticky;
    top: 0;
    z-index: 3;
    background: linear-gradient(180deg, rgba(248,250,252,.98), rgba(248,250,252,.92));
    padding-top: 4px;
    margin-top: -2px;
    backdrop-filter: blur(6px);
  }
  .flex-end {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .flex-end .btn {
    width: 100%;
  }
}


/* Esquema de daños ampliado: pantalla completa y orientación horizontal */
.expand-schema-btn { margin-right: auto; }
.damage-session-actions { flex-wrap: wrap; }
.damage-schema-fullscreen-open { overflow: hidden !important; }
.damage-schema-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
  gap: 6px;
  padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
  background: #0f172a;
  color: #fff;
  overflow: hidden;
}
.damage-schema-fullscreen__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 36px;
}
.damage-schema-fullscreen__header > div { display: grid; }
.damage-schema-fullscreen__header strong { font-size: 18px; line-height: 1.1; }
.damage-schema-fullscreen__close {
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 10px;
  background: rgba(255,255,255,.10);
  color: #fff;
  font-size: 15px;
  line-height: 1;
}
.damage-schema-fullscreen__toolbar,
.damage-schema-fullscreen__toolbar[style] {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  margin: 0 !important;
}
.damage-schema-fullscreen__toolbar > span { display: none; }
.damage-schema-fullscreen__toolbar .damage-btn {
  background: rgba(255,255,255,.96);
  min-height: 42px;
}
.damage-schema-fullscreen__rotate-hint {
  display: none;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(245,158,11,.16);
  border: 1px solid rgba(245,158,11,.34);
  color: #fde68a;
  font-size: 12px;
  text-align: center;
}
.damage-schema-fullscreen__viewport {
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.damage-schema-fullscreen .schema-container {
  width: fit-content;
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  padding: 6px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
}
.damage-schema-fullscreen .schema-img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: calc(100dvh - 164px);
}
.damage-schema-fullscreen__footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr);
  gap: 10px;
}
.damage-schema-fullscreen__footer .btn { width: 100%; }
.damage-schema-fullscreen__undo {
  opacity: .46;
  background: rgba(255,255,255,.72) !important;
  color: rgba(15,23,42,.72) !important;
  transition: opacity .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.damage-schema-fullscreen__undo.has-action:not(:disabled) {
  opacity: 1;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.damage-schema-fullscreen__undo:disabled {
  cursor: not-allowed;
  pointer-events: auto;
}
.damage-schema-fullscreen__feedback {
  position: absolute;
  left: 50%;
  bottom: calc(max(10px, env(safe-area-inset-bottom)) + 66px);
  z-index: 4;
  max-width: min(92vw, 520px);
  padding: 10px 16px;
  border-radius: 12px;
  background: rgba(15,23,42,.94);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  box-shadow: 0 12px 30px rgba(0,0,0,.30);
  opacity: 0;
  transform: translate(-50%, 10px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.damage-schema-fullscreen__feedback.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
.damage-schema-fullscreen__feedback.success { border-color: rgba(34,197,94,.65); }
.damage-schema-fullscreen__feedback.info { border-color: rgba(59,130,246,.65); }
.damage-schema-fullscreen__feedback.error { border-color: rgba(239,68,68,.70); }

.schema-fullscreen-placeholder {
  width: 100%;
  border: 1px dashed rgba(148,163,184,.25);
  border-radius: 16px;
  background: rgba(248,250,252,.55);
}
@media (orientation: portrait) and (max-width: 900px) {
  .damage-schema-fullscreen__rotate-hint { display: block; }
  .damage-schema-fullscreen .schema-img { max-height: calc(100dvh - 220px); }
}
@media (orientation: landscape) {
  .damage-schema-fullscreen {
    grid-template-columns: 150px minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
  .damage-schema-fullscreen__header {
    grid-column: 1 / -1;
  }
  .damage-schema-fullscreen__toolbar,
  .damage-schema-fullscreen__toolbar[style] {
    grid-column: 1;
    grid-row: 2;
    grid-template-columns: 1fr !important;
    align-content: center;
  }
  .damage-schema-fullscreen__rotate-hint { display: none; }
  .damage-schema-fullscreen__viewport {
    grid-column: 2;
    grid-row: 2;
  }
  .damage-schema-fullscreen .schema-img {
    max-height: calc(100dvh - 106px);
    max-width: calc(100dvw - 176px);
  }
  .damage-schema-fullscreen__footer {
    grid-column: 1 / -1;
    grid-row: 3;
  }
}
@media (max-width: 560px) {
  .damage-session-actions .btn { flex: 1 1 100%; }
  .damage-schema-fullscreen__toolbar,
  .damage-schema-fullscreen__toolbar[style] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .damage-schema-fullscreen__footer {
    grid-template-columns: 1fr 1fr;
  }
}


/* Fase 2 completa: formularios largos y listas de chequeo progresivas */
.vehicle-form-progress {
  padding: 14px 16px;
  border: 1px solid rgba(36,58,143,.14);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(36,58,143,.07), rgba(255,255,255,.96));
  box-shadow: 0 7px 20px rgba(15,23,42,.04);
}
.vehicle-form-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 9px;
  font-size: 12px;
}
.vehicle-form-progress-head strong { color: var(--text); font-size: 13px; }
.vehicle-form-progress-text { color: var(--muted); text-align: right; }
.vehicle-form-progress-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(36,58,143,.10);
}
.vehicle-form-progress-fill {
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #243a8f, #3b5ccc);
  transition: width .25s ease;
}
.vehicle-section-toggle {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  margin-bottom: 14px;
}
.vehicle-section-status {
  min-width: 42px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(148,163,184,.15);
  color: #64748b;
  text-align: center;
  font-size: 11px;
  font-weight: 800;
}
.vehicle-form-section.is-complete .vehicle-section-status {
  background: rgba(34,197,94,.12);
  color: #15803d;
}
.vehicle-section-chevron {
  font-size: 18px;
  line-height: 1;
  transition: transform .18s ease;
}
.vehicle-form-section.is-collapsed .vehicle-section-chevron { transform: rotate(-90deg); }
.vehicle-form-section.is-collapsed > :not(.section-mini-title) { display: none !important; }

.checklist-accordion-grid { gap: 10px; }
.checklist-accordion-group {
  border: 1px solid rgba(148,163,184,.24);
  border-radius: 16px;
  background: rgba(255,255,255,.88);
  overflow: clip;
  box-shadow: 0 6px 18px rgba(15,23,42,.035);
}
.checklist-accordion-group > summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 12px 14px;
  cursor: pointer;
  color: #334155;
  font-size: 13px;
  font-weight: 800;
  background: rgba(248,250,252,.94);
}
.checklist-accordion-group > summary::-webkit-details-marker { display: none; }
.checklist-accordion-group > summary::after {
  content: '⌄';
  margin-left: 4px;
  color: #64748b;
  transition: transform .18s ease;
}
.checklist-accordion-group[open] > summary::after { transform: rotate(180deg); }
.checklist-group-progress {
  margin-left: auto;
  min-width: 46px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(36,58,143,.09);
  color: #243a8f;
  text-align: center;
  font-size: 11px;
}
.checklist-accordion-group.is-complete > summary {
  background: rgba(240,253,244,.94);
  color: #166534;
}
.checklist-accordion-group.is-complete .checklist-group-progress {
  background: rgba(34,197,94,.13);
  color: #15803d;
}
.checklist-group-body {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 9px;
}

/* Fase 3 parcial: filtros y tarjetas con mayor claridad móvil */
@media (max-width: 700px) {
  .vehicle-modal-body { gap: 12px; }
  .vehicle-form-section { margin: 0; }
  .vehicle-form-section.is-collapsed { padding-bottom: 8px; }
  .vehicle-form-section.is-collapsed .section-mini-title { margin-bottom: 0; }
  .vehicle-form-progress-head { align-items: flex-start; flex-direction: column; gap: 3px; }
  .vehicle-form-progress-text { text-align: left; }
  .checklist-group-body { padding: 8px; }
  .checklist-accordion-group > summary { position: sticky; top: 0; z-index: 2; }
  .filter-row, .filters-row, .report-filters, .vehicle-filter-row {
    overflow-x: auto;
    flex-wrap: nowrap !important;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  .filter-row::-webkit-scrollbar, .filters-row::-webkit-scrollbar,
  .report-filters::-webkit-scrollbar, .vehicle-filter-row::-webkit-scrollbar { display: none; }
}


/* ==============================================================
   FIX92R34BE · Fase 3 — listados, resúmenes y firma consistente
   ============================================================== */

/* Firma: etiqueta única, área móvil más cómoda y control consistente. */
.sig-clear {
  min-width: 104px;
  min-height: 38px;
  padding: 7px 11px;
  border: 1px solid rgba(100,116,139,.24);
  color: #475569;
  white-space: nowrap;
}
.sig-container:focus-within {
  border-color: rgba(36,58,143,.52);
  box-shadow: 0 0 0 4px rgba(36,58,143,.08), 0 12px 30px rgba(15,23,42,.07);
}

/* Cabeceras y barras de herramientas de páginas operativas. */
#page-reportes > .card,
#page-usuarios > .card,
#page-vehiculos > .card {
  border: 1px solid rgba(148,163,184,.18);
  box-shadow: 0 14px 36px rgba(15,23,42,.055);
}
#page-reportes .card-title,
#page-usuarios .card-title,
#page-vehiculos .card-title {
  font-size: 18px;
  letter-spacing: -.012em;
}
#page-reportes input[type="search"],
#page-usuarios input[type="search"],
#page-vehiculos input[type="search"] {
  min-height: 46px;
  border-radius: 12px !important;
  background: #fff !important;
  border-color: rgba(148,163,184,.34) !important;
  box-shadow: 0 4px 14px rgba(15,23,42,.025);
}
#page-reportes input[type="search"]:focus,
#page-usuarios input[type="search"]:focus,
#page-vehiculos input[type="search"]:focus {
  border-color: rgba(36,58,143,.55) !important;
  box-shadow: 0 0 0 4px rgba(36,58,143,.08);
}

/* KPIs: mayor jerarquía sin convertirlos en bloques pesados. */
.kpi-strip { gap: 9px; margin: 12px 0 16px; }
.kpi-card {
  min-height: 74px;
  border-radius: 15px;
  border: 1px solid rgba(148,163,184,.20);
  box-shadow: 0 7px 20px rgba(15,23,42,.04);
}
.kpi-value { font-size: 21px; line-height: 1; }
.kpi-label { font-size: 11.5px; line-height: 1.22; }

/* Filtros: respirables, desplazables y con selección visible. */
.tv-filtros {
  gap: 7px;
  padding-block: 2px;
  scrollbar-width: thin;
}
.tv-filtros button,
.tv-filtros .filter-chip,
.tv-filtros .tv-chip {
  min-height: 38px;
  border-radius: 999px;
  white-space: nowrap;
}
.tv-active-filter-chips { gap: 6px; }
.usuarios-toolbar,
.vehicle-history-toolbar {
  border-radius: 14px;
}

/* Tablas operativas: filas más fáciles de escanear. */
.tv-table-wrap,
.table-wrap {
  border: 1px solid rgba(148,163,184,.20);
  border-radius: 15px;
  overflow: hidden;
  background: #fff;
}
.tv-table tbody tr,
table tbody tr { transition: background-color .14s ease; }
.tv-table tbody tr:hover,
table tbody tr:hover { background: rgba(36,58,143,.035); }
.tv-table th,
.tv-table td { padding-block: 12px; }
.tv-cell-sub { margin-top: 4px; line-height: 1.28; }
.tv-status-stack { gap: 5px; }

/* Tarjetas y resúmenes de vehículos/usuarios. */
.user-card,
.usuario-card,
.vehicle-list-card,
.vehicle-summary-card,
.report-card {
  border-radius: 16px;
  border: 1px solid rgba(148,163,184,.20);
  box-shadow: 0 7px 22px rgba(15,23,42,.04);
}
.user-card:hover,
.usuario-card:hover,
.vehicle-list-card:hover,
.report-card:hover { box-shadow: 0 12px 28px rgba(15,23,42,.075); }

/* Detalles y perfil: secciones claras y lectura vertical. */
.modal-detail-card,
.profile-modal,
.vehicle-history-modal {
  border: 1px solid rgba(148,163,184,.16);
}
.modal-detail-header,
.profile-modal-header,
.vehicle-history-header {
  border-bottom: 1px solid rgba(148,163,184,.18);
  background: linear-gradient(180deg,#fff,#fbfdff);
}
.detail-section,
.profile-section,
.permanente-doc-summary {
  border-radius: 14px;
}
.detail-label {
  color: #64748b;
  font-size: 11px;
  letter-spacing: .035em;
  text-transform: uppercase;
  font-weight: 750;
}
.detail-value { font-size: 14px; line-height: 1.38; }

/* Historial: sube los tamaños mínimos que en móvil eran demasiado pequeños. */
.vehicle-history-person span,
.vehicle-history-metric span { font-size: 10px; }
.vehicle-history-person strong { font-size: 13px; line-height: 1.3; }
.vehicle-history-person small { font-size: 11.5px; line-height: 1.35; }
.vehicle-history-metric strong { font-size: 12.5px; line-height: 1.3; }
.vehicle-history-note { font-size: 12.5px; line-height: 1.42; }
.vehicle-history-entry { border-radius: 14px; }

/* Notificaciones: título y metadatos con lectura rápida. */
.notification-panel { border-radius: 18px; }
.notification-item { border: 1px solid rgba(148,163,184,.16); }
.notification-item + .notification-item { margin-top: 7px; }
.notification-body strong { font-size: 14px; }
.notification-body span { -webkit-line-clamp: 2; }
.notification-body em { color: #64748b; }

@media (max-width: 700px) {
  .sig-container, .sig-canvas {
    min-height: 210px;
  }
  .sig-clear {
    min-width: 100px;
    min-height: 38px;
    font-size: 11.5px;
  }

  #page-reportes > .card,
  #page-usuarios > .card,
  #page-vehiculos > .card {
    padding: 14px 12px !important;
    border-radius: 18px;
  }

  .usuarios-head,
  #page-vehiculos .flex-between,
  #page-reportes > .card > div:first-child {
    align-items: flex-start !important;
    gap: 10px;
  }
  .usuarios-status-filter,
  #page-vehiculos .gap-8 {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 3px;
    flex-wrap: nowrap !important;
  }
  .usuarios-status-filter .btn,
  #page-vehiculos .gap-8 .btn { flex: 0 0 auto; }

  .kpi-strip {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    overflow: visible;
  }
  .kpi-card { min-width: 0; min-height: 70px; }

  .usuarios-filter-row {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 9px;
  }
  #usuarios-role-filter { width: 100%; min-height: 44px; }

  .tv-table-wrap,
  .table-wrap {
    border-radius: 13px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .tv-table th,
  .tv-table td { padding: 11px 10px; }

  .modal-detail-card,
  .profile-modal,
  .vehicle-history-modal { border-radius: 22px 22px 0 0 !important; }
  .modal-detail-header,
  .profile-modal-header,
  .vehicle-history-header { position: sticky; top: 0; z-index: 5; }

  .detail-grid,
  .profile-grid { grid-template-columns: 1fr !important; }
  .detail-row,
  .profile-row {
    padding-block: 10px;
    align-items: flex-start;
  }
  .detail-value,
  .profile-row strong { overflow-wrap: anywhere; }

  .vehicle-history-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vehicle-history-tools { gap: 8px; }
  .vehicle-history-export { width: 100%; justify-content: center; }

  .notification-panel {
    width: calc(100vw - 16px);
    max-width: none;
  }
}

@media (max-width: 380px) {
  .kpi-strip { grid-template-columns: 1fr 1fr; gap: 7px; }
  .kpi-value { font-size: 19px; }
  .vehicle-history-metrics { grid-template-columns: 1fr; }
}
