/* ===================================================================
   Portal · Tarjetas operativas unificadas
   Alcance: .portal-ops-card, .trip-ops-card, .directory-card, .hiring-candidate-card
   =================================================================== */

:root {
  --ops-cards-min: 17.5rem;
  --ops-cards-max: 20rem;
  --ops-cards-gap: 0.75rem;
  --ops-card-accent: #1d63d3;
  --ops-tile-grid: repeat(auto-fit, minmax(min(100%, var(--ops-cards-min)), var(--ops-cards-max)));
  --ops-tile-grid-kpi: repeat(auto-fit, minmax(min(100%, 11rem), 14rem));
}

.portal-ops-cards,
.trip-ops-cards,
.request-ops-cards,
.directory-grid,
.payroll-run-cards-grid,
.b2b-leads-mosaic,
.vehicle-ops-cards,
.drivers-ops-cards,
.employees-grid,
.hiring-cards.hiring-cards--candidates,
.history-fleet-log-grid,
.admin-users-list-shell .user-grid,
.reports-studio .reports-export-grid {
  display: grid;
  grid-template-columns: var(--ops-tile-grid);
  justify-content: start;
  justify-items: start;
  align-items: start;
  gap: var(--ops-cards-gap);
  width: 100%;
  min-width: 0;
  container-type: inline-size;
  container-name: ops-cards;
}

.portal-ops-card,
.trip-ops-card,
.directory-card:not(.directory-card--compact),
.hiring-candidate-card {
  position: relative;
  border: 1px solid #e8edf3;
  border-radius: 12px;
  padding: 0.62rem 0.78rem 0.58rem 0.88rem;
  background: #ffffff;
  display: grid;
  gap: 0.42rem;
  box-shadow: 0 4px 18px rgba(15, 35, 70, 0.07), 0 1px 3px rgba(15, 35, 70, 0.04);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  min-width: 0;
  max-width: var(--ops-cards-max);
  width: min(100%, var(--ops-cards-max));
  justify-self: start;
  overflow: hidden;
  container-type: inline-size;
  container-name: ops-card;
}

.portal-ops-card::before,
.trip-ops-card::before,
.directory-card:not(.directory-card--compact)::before,
.hiring-candidate-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 12px 0 0 12px;
  background: var(--ops-card-accent, #1d63d3);
  pointer-events: none;
}

.portal-ops-card:hover,
.trip-ops-card:hover,
.directory-card:not(.directory-card--compact):hover,
.hiring-candidate-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(15, 35, 70, 0.11), 0 2px 6px rgba(15, 35, 70, 0.05);
  border-color: #d4e0ef;
}

/* ── Cabecera tipo ficha: logo | info | badges ── */
.trip-ops-card-head,
.directory-card__head,
.hiring-candidate-card__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  column-gap: 0.45rem;
  row-gap: 0.28rem;
  align-items: start;
  min-width: 0;
}

.portal-ops-card .trip-ops-card-head-main,
.portal-ops-card .directory-card__identity {
  display: contents;
}

.portal-ops-card .trip-ops-card-head-info,
.portal-ops-card .directory-card__heading {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.portal-ops-card .portal-ops-card-avatar,
.portal-ops-card .request-ops-card-company-logo,
.portal-ops-card .driver-avatar,
.portal-ops-card .directory-card__avatar,
.portal-ops-card .vehicle-plate-badge {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
}

.portal-ops-card .portal-ops-card-badges,
.portal-ops-card .directory-card__status-stack {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
}

.portal-ops-card .trip-ops-card-head--driver .trip-ops-card-head-main,
.portal-ops-card .trip-ops-card-head--vehicle .trip-ops-card-head-main {
  display: contents;
}

.trip-ops-card-head-main {
  min-width: 0;
}

.trip-ops-card-head-info,
.directory-card__heading {
  min-width: 0;
  width: 100%;
}

.trip-ops-card-kicker,
.directory-card__kicker {
  margin: 0 0 0.12rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7f96;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card-refs {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.22rem;
  margin: 0 0 0.28rem;
  min-width: 0;
}

.portal-ops-card-ref {
  display: grid;
  gap: 0.04rem;
  align-content: start;
  min-width: 0;
  padding: 0.24rem 0.34rem;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
}

.portal-ops-card-ref-label {
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #8a96a8;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card-ref-value {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #152a44;
  line-height: 1.2;
  min-width: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.portal-ops-card-status-pill__text {
  min-width: 0;
  max-width: 6.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.2;
}

.portal-ops-card.trip-ops-card .trip-ops-card-title,
.portal-ops-card .directory-card__title,
.portal-ops-card .hiring-candidate-card__head h4 {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.18;
  font-weight: 800;
  color: #0d2f5c;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.request-ops-card-meta,
.portal-ops-card .muted.request-ops-card-meta {
  margin: 0.12rem 0 0;
  font-size: 0.68rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card-badges,
.driver-card-badges,
.vehicle-card-badges,
.directory-card__status-stack {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 0.22rem;
  flex: 0 0 auto;
  max-width: 42%;
  min-width: 0;
}

/* ── Pills de estado ── */
.portal-ops-card-status-pill,
.vehicle-card-status-pill,
.driver-card-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.28rem 0.52rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1.2;
  color: #ffffff;
  white-space: nowrap;
  max-width: 100%;
}

.portal-ops-card-status-pill__dot,
.vehicle-card-status-pill__dot,
.driver-card-status-pill__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.28);
  flex: 0 0 auto;
}

.portal-ops-card-status-pill--disponible,
.portal-ops-card-status-pill--available,
.vehicle-card-status-pill--disponible,
.driver-card-status-pill--available {
  background: linear-gradient(135deg, #16a34a, #22c55e);
  box-shadow: 0 4px 12px rgba(34, 197, 94, 0.28);
}

.portal-ops-card-status-pill--ocupado,
.portal-ops-card-status-pill--busy,
.vehicle-card-status-pill--ocupado,
.driver-card-status-pill--busy {
  background: linear-gradient(135deg, #c2410c, #ea580c);
  box-shadow: 0 4px 12px rgba(234, 88, 12, 0.24);
}

.portal-ops-card-status-pill--reservado,
.portal-ops-card-status-pill--scheduled,
.vehicle-card-status-pill--reservado,
.driver-card-status-pill--scheduled {
  background: linear-gradient(135deg, #4f46e5, #6366f1);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.24);
}

.portal-ops-card-status-pill--no-disponible,
.portal-ops-card-status-pill--offline,
.vehicle-card-status-pill--no-disponible,
.driver-card-status-pill--offline {
  background: linear-gradient(135deg, #b45309, #d97706);
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.24);
}

.portal-ops-card-status-pill--ok {
  background: linear-gradient(135deg, #16a34a, #22c55e);
  box-shadow: 0 4px 12px rgba(34, 197, 94, 0.28);
}

/* Flujo solicitud / viaje — un color distinto por estado */
.portal-ops-card-status-pill--pendiente {
  background: linear-gradient(135deg, #b45309, #f59e0b);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.28);
}

.portal-ops-card-status-pill--aprobada_pendiente_asignacion {
  background: linear-gradient(135deg, #1d4ed8, #2563eb);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.28);
}

.portal-ops-card-status-pill--viaje_asignado {
  background: linear-gradient(135deg, #15803d, #16a34a);
  box-shadow: 0 4px 12px rgba(22, 163, 74, 0.28);
}

.portal-ops-card-status-pill--en_transito {
  background: linear-gradient(135deg, #1d63d3, #0284c7);
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.26);
}

.portal-ops-card-status-pill--espera_standby {
  background: linear-gradient(135deg, #4338ca, #6366f1);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.24);
}

.portal-ops-card-status-pill--completada {
  background: linear-gradient(135deg, #0e7490, #0891b2);
  box-shadow: 0 4px 12px rgba(8, 145, 178, 0.24);
}

.portal-ops-card-status-pill--cerrada {
  background: linear-gradient(135deg, #475569, #334155);
  box-shadow: 0 4px 12px rgba(51, 65, 85, 0.28);
}

.portal-ops-card-status-pill--vencida {
  background: linear-gradient(135deg, #9a3412, #c2410c);
  box-shadow: 0 4px 12px rgba(154, 52, 18, 0.26);
}

.portal-ops-card-status-pill--cancelada,
.portal-ops-card-status-pill--rechazada,
.portal-ops-card-status-pill--inactive {
  background: linear-gradient(135deg, #b91c1c, #dc2626);
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.24);
}

/* ── Pills documentales ── */
.portal-ops-card-doc-pill,
.vehicle-card-equip-pill,
.driver-card-doc-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  white-space: normal;
  text-align: center;
  overflow-wrap: anywhere;
  border: 1px solid transparent;
}

.portal-ops-card-doc-pill__icon svg,
.driver-card-doc-pill__icon svg {
  width: 0.75rem;
  height: 0.75rem;
}

.portal-ops-card-doc-pill--ok,
.driver-card-doc-pill--ok {
  color: #047857;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.16), rgba(16, 185, 129, 0.08));
  border-color: rgba(16, 185, 129, 0.28);
}

.portal-ops-card-doc-pill--warning,
.driver-card-doc-pill--warning {
  color: #b45309;
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.18), rgba(245, 158, 11, 0.08));
  border-color: rgba(245, 158, 11, 0.32);
}

.portal-ops-card-doc-pill--missing,
.driver-card-doc-pill--missing {
  color: #92400e;
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.18), rgba(251, 191, 36, 0.08));
  border-color: rgba(245, 158, 11, 0.28);
}

.portal-ops-card-doc-pill--expired,
.driver-card-doc-pill--expired {
  color: #b91c1c;
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.16), rgba(239, 68, 68, 0.08));
  border-color: rgba(239, 68, 68, 0.28);
}

/* ── Barras de contexto / viaje ── */
.portal-ops-card-highlight,
.vehicle-availability-bar,
.driver-trip-bar,
.driver-availability-bar,
.directory-card__ops {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.38rem;
  padding: 0.42rem 0.52rem;
  border-radius: 9px;
  border: 1px solid rgba(16, 185, 129, 0.28);
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.14), rgba(16, 185, 129, 0.06));
  min-width: 0;
}

.request-ops-card .request-ops-card-trip,
.trip-ops-card-standby.request-ops-card-trip {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.38rem;
  min-width: 0;
}

.request-ops-card .request-ops-card-trip > span:not(.request-ops-card-trip-ico),
.trip-ops-card-standby.request-ops-card-trip > span:not(.request-ops-card-trip-ico) {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
  font-size: 0.72rem;
}

.request-ops-card-company-logo,
.request-ops-card-company-logo img {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  object-fit: contain;
}

.request-ops-card-trip-ico {
  flex: 0 0 auto;
}

.portal-ops-card-actions-grid .trip-ops-card-btn--danger:last-child {
  grid-column: 1 / -1;
  max-width: 50%;
  justify-self: start;
}

.driver-trip-bar__copy span,
.driver-availability-bar__detail,
.vehicle-availability-bar__detail {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vehicle-plate-badge__text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.driver-trip-bar__map {
  flex: 1 1 8.5rem;
  min-width: 0;
  max-width: 100%;
}

.vehicle-availability-bar__update {
  flex: 1 1 8rem;
  min-width: 0;
  max-width: 100%;
}

.portal-ops-card-highlight__dot,
.directory-card__ops-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: #16a34a;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.18);
}

.portal-ops-card-highlight__copy strong,
.directory-card__ops-body strong {
  display: block;
  font-size: 0.84rem;
  font-weight: 800;
  color: #0f5132;
  line-height: 1.2;
}

.directory-card__ops-detail {
  display: block;
  font-size: 0.72rem;
  color: #64748b;
  line-height: 1.3;
}

.directory-card__ops--warn,
.directory-card__ops--alert {
  border-color: rgba(245, 158, 11, 0.32);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.14), rgba(245, 158, 11, 0.06));
}

.directory-card__ops--alert {
  border-color: rgba(239, 68, 68, 0.28);
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(239, 68, 68, 0.05));
}

/* ── Cuadrícula de datos ── */
.portal-ops-card-spec-grid,
.trip-ops-card-grid,
.vehicle-card-spec-grid,
.driver-card-spec-grid,
.directory-card__metrics,
.directory-card__facts,
.hiring-candidate-card__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.directory-card__metrics--triple {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.directory-card__metrics--quad {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.portal-ops-card-spec-grid .trip-ops-card-item,
.trip-ops-card-grid .trip-ops-card-item,
.vehicle-card-spec-grid .trip-ops-card-item,
.driver-card-spec-grid .trip-ops-card-item,
.directory-card__chip,
.directory-chip,
.directory-card__fact {
  display: grid;
  gap: 0.18rem;
  padding: 0.38rem 0.48rem;
  border-radius: 9px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
  min-width: 0;
}

.directory-chip small,
.directory-card__fact dt,
.trip-ops-card-item-label {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.45px;
  font-weight: 700;
  color: #8a96a8;
  margin: 0;
}

.directory-chip strong,
.directory-card__fact dd,
.trip-ops-card-item-body {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  margin: 0;
  font-size: 0.86rem;
  font-weight: 700;
  color: #152a44;
}

.trip-ops-card-item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  background: #e8f1fc;
  color: #1d63d3;
  flex: 0 0 auto;
}

.trip-ops-card-item-icon svg {
  width: 0.85rem;
  height: 0.85rem;
}

.trip-ops-card-item-value {
  font-size: 0.72rem;
  font-weight: 700;
  color: #152a44;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.2;
}

.portal-ops-card .trip-ops-card-item-body {
  font-size: 0.72rem;
}

.portal-ops-card .trip-ops-card-route-node strong {
  font-size: 0.72rem;
}

.trip-ops-card-item-value--ok { color: #16a34a !important; }
.trip-ops-card-item-value--warn { color: #d97706 !important; }
.trip-ops-card-item-value--alert { color: #dc2626 !important; }

.trip-ops-card-item dd {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.portal-ops-card-spec-sub,
.driver-card-spec-sub {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.25;
  color: #64748b;
}

.portal-ops-card-spec-sub--ok,
.driver-card-spec-sub--ok { color: #16a34a; }
.portal-ops-card-spec-sub--warn,
.driver-card-spec-sub--warn { color: #d97706; }
.portal-ops-card-spec-sub--alert,
.driver-card-spec-sub--alert { color: #dc2626; }

.directory-chip--ok strong,
.directory-card__fact--ok dd { color: #16a34a; }
.directory-chip--warn strong,
.directory-card__fact--warn dd { color: #d97706; }
.directory-chip--alert strong,
.directory-card__fact--alert dd { color: #dc2626; }

.hiring-candidate-card__meta > div {
  display: grid;
  gap: 0.35rem;
  padding: 0.55rem 0.65rem;
  border-radius: 11px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
}

.hiring-candidate-card__meta dt {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.45px;
  font-weight: 700;
  color: #8a96a8;
}

.hiring-candidate-card__meta dd {
  margin: 0;
  font-size: 0.86rem;
  font-weight: 700;
  color: #152a44;
}

/* ── Ruta (viajes / solicitudes) ── */
.trip-ops-card-route {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.28rem;
  padding: 0.32rem 0.45rem;
  background: #f8fafc;
  border: 1px solid #edf1f5;
  border-radius: 8px;
  min-width: 0;
}

.trip-ops-card-route-node {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  align-content: center;
}

.trip-ops-card-route-node--dest {
  text-align: right;
  justify-items: end;
}

.trip-ops-card-route-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #8a96a8;
}

.trip-ops-card-route-city {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
  max-width: 100%;
}

.trip-ops-card-route-node strong {
  font-size: 0.8rem;
  color: #152a44;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.trip-ops-card-route-connector {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  min-width: 1.5rem;
  max-width: 3.5rem;
  align-self: center;
  flex: 0 0 auto;
}

.trip-ops-card-route-line {
  flex: 1 1 auto;
  border-top: 2px dotted #c8d2de;
  min-width: 0.5rem;
}

.trip-ops-card-route-arrow {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.trip-ops-card-route-arrow svg {
  width: 0.95rem;
  height: 0.95rem;
  color: #1d63d3;
}

/* ── Acciones ── */
.portal-ops-card-actions,
.trip-ops-card-actions,
.directory-card__actions,
.hiring-candidate-card__actions {
  display: grid;
  gap: 0.24rem;
  padding-top: 0;
}

.portal-ops-card-actions-grid,
.vehicle-card-actions-grid,
.driver-card-actions-grid,
.trip-ops-card-actions-primary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.32rem;
}

.portal-ops-card-actions .btn,
.directory-card__actions .btn,
.hiring-candidate-card__actions .btn,
.trip-ops-card-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-width: 0;
  width: 100%;
  min-height: 1.85rem;
  border-radius: 8px;
  font-size: 0.66rem;
  font-weight: 700;
  padding: 0.3rem 0.38rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trip-ops-card-btn--outline,
.directory-card__actions .btn-outline {
  background: #ffffff;
  border: 1.5px solid #1d63d3;
  color: #1d63d3;
}

.trip-ops-card-btn--solid,
.directory-card__actions .btn-primary,
.directory-card__actions .btn-action:first-of-type {
  background: #1d63d3;
  border: 1.5px solid #1d63d3;
  color: #ffffff;
}

.trip-ops-card-btn--soft {
  background: #f3f8ff;
  border: 1.5px solid #c8daf0;
  color: #1d63d3;
}

.trip-ops-card-btn--danger,
.directory-card__actions .btn-reject {
  background: #fff5f5;
  border: 1.5px solid #f5c2c7;
  color: #dc3545;
}

.driver-card-status-btn,
.portal-ops-card-actions__full {
  width: 100%;
}

.trip-ops-card-status-block {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}

.trip-ops-card-status-picker {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.75rem;
  border-radius: 11px;
  background: #edf4fc;
  border: 1px solid #c8daf0;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

.trip-ops-card-status-picker select.trip-status-select {
  flex: 1 1 8rem;
  min-width: 0;
  max-width: 100%;
}

.request-ops-card-company-logo,
.vehicle-plate-badge,
.driver-avatar,
.portal-ops-card-avatar {
  flex-shrink: 0;
}

/* ── Pie ── */
.portal-ops-card-foot,
.trip-ops-card-foot {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.4rem;
  padding-top: 0.38rem;
  border-top: 1px solid #eef1f5;
  font-size: 0.72rem;
  color: #8a96a8;
  min-width: 0;
}

.trip-ops-card-foot-created {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.35rem;
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.45;
}

.trip-ops-card-foot-created > span:last-child {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Avatares unificados ── */
.directory-card__avatar,
.driver-avatar,
.portal-ops-card-avatar {
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(145deg, #dbeafe, #bfdbfe);
  color: #1e3a8a;
  font-weight: 800;
  letter-spacing: 0.04em;
  overflow: hidden;
}

.directory-card__avatar--photo,
.driver-avatar--photo {
  padding: 0;
}

.directory-card__avatar img,
.driver-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Overrides directory legacy — franja lateral la define ::before unificado */
.directory-card:not(.directory-card--compact)::before {
  display: block;
}

.directory-card:not(.directory-card--compact) {
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(15, 35, 70, 0.07), 0 1px 3px rgba(15, 35, 70, 0.04);
  border-color: #e8edf3;
}

.directory-card__banner {
  border-radius: 10px;
  padding: 0.55rem 0.65rem;
  font-size: 0.76rem;
}

.directory-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.user-grid.directory-grid,
.drivers-grid.directory-grid,
.payroll-employees-grid.directory-grid,
.hiring-cards--candidates.portal-ops-cards {
  grid-template-columns: var(--ops-tile-grid);
  justify-content: start;
  gap: var(--ops-cards-gap);
}

.directory-card__title,
.directory-card__subline,
.directory-card__fact dd,
.directory-chip strong,
.payroll-run-card-title,
.payroll-run-card-employee,
.payroll-run-card-kicker,
.b2b-leads-title,
.b2b-leads-company,
.b2b-leads-meta dd,
.hiring-candidate-card__meta dd {
  overflow: hidden;
  text-overflow: ellipsis;
}

.directory-card__title,
.payroll-run-card-title,
.b2b-leads-title,
.hiring-candidate-card__meta dd {
  white-space: nowrap;
}

.directory-card__subline,
.directory-card__fact dd,
.directory-chip strong,
.payroll-run-card-employee,
.b2b-leads-meta dd {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: normal;
  word-break: break-word;
}

.directory-card__compact-row {
  min-width: 0;
}

.directory-card__compact-meta,
.directory-card__compact-actions {
  flex-wrap: wrap;
}

.directory-card--compact {
  min-width: 0;
  container-type: inline-size;
  container-name: ops-card;
}

.payroll-run-card,
.b2b-leads-card,
.history-fleet-log-card {
  min-width: 0;
  max-width: var(--ops-cards-max);
  width: 100%;
  container-type: inline-size;
  container-name: ops-card;
}

.payroll-run-card-actions {
  display: flex;
  flex-wrap: wrap;
}

.payroll-run-card-actions > .btn {
  flex: 1 1 8.5rem;
  min-width: 0;
  white-space: normal;
  text-align: center;
  line-height: 1.25;
}

.b2b-leads-chip-row {
  flex-wrap: wrap;
}

.payroll-run-card-head,
.b2b-leads-card-top {
  min-width: 0;
}

/* ── Container queries: solo en tarjetas muy estrechas ── */
@container ops-card (max-width: 15.5rem) {
  .trip-ops-card-head,
  .directory-card__head,
  .hiring-candidate-card__head {
    flex-wrap: wrap;
  }

  .portal-ops-card-badges,
  .driver-card-badges,
  .vehicle-card-badges,
  .directory-card__status-stack {
    max-width: 100%;
    justify-content: flex-start;
  }

  .trip-ops-card-route {
    grid-template-columns: 1fr;
    text-align: left;
  }

  .trip-ops-card-route-node--dest {
    text-align: left;
    justify-items: start;
  }

  .trip-ops-card-route-connector {
    display: none;
  }

  .portal-ops-card-spec-grid,
  .trip-ops-card-grid,
  .vehicle-card-spec-grid,
  .driver-card-spec-grid,
  .directory-card__metrics:not(.directory-card__metrics--triple):not(.directory-card__metrics--quad),
  .directory-card__facts,
  .hiring-candidate-card__meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-ops-card-actions-grid,
  .vehicle-card-actions-grid,
  .driver-card-actions-grid,
  .trip-ops-card-actions-primary {
    grid-template-columns: 1fr;
  }
}

@container ops-card (max-width: 16rem) {
  .portal-ops-card-status-pill,
  .vehicle-card-status-pill,
  .driver-card-status-pill {
    white-space: normal;
    text-align: center;
  }

  .portal-ops-card.trip-ops-card--vehicle .portal-ops-card-status-pill,
  .portal-ops-card.trip-ops-card--driver .portal-ops-card-status-pill {
    white-space: nowrap;
    text-align: left;
  }

  .portal-ops-card-status-pill__text {
    max-width: none;
    white-space: normal;
  }

  .portal-ops-card.trip-ops-card--vehicle .portal-ops-card-status-pill__text,
  .portal-ops-card.trip-ops-card--driver .portal-ops-card-status-pill__text {
    white-space: nowrap;
    max-width: 7.5rem;
  }
}

/* ===================================================================
   Módulos del portal — fichas compactas (ancho fijo, estilo tarjeta)
   =================================================================== */

/* ── Rejillas por studio (todos los módulos) ── */
.vehicles-studio .vehicle-ops-cards,
.vehicles-studio .trip-ops-cards.portal-ops-cards,
.vehicles-studio .trip-ops-cards.vehicle-ops-cards,
.drivers-studio .drivers-ops-cards,
.drivers-studio .trip-ops-cards.portal-ops-cards,
.drivers-studio .trip-ops-cards.drivers-ops-cards {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-start;
  gap: var(--ops-cards-gap);
  width: 100%;
  min-width: 0;
  grid-template-columns: unset;
}

.vehicles-studio .trip-ops-card.portal-ops-card.trip-ops-card--vehicle,
.drivers-studio .trip-ops-card.portal-ops-card.trip-ops-card--driver {
  flex: 0 0 auto;
  width: min(100%, var(--ops-cards-max));
  max-width: var(--ops-cards-max);
}

.requests-studio .requests-data-results .request-ops-cards,
.requests-studio .requests-data-results .trip-ops-cards,
.transport-studio .transport-data-pane__body .request-ops-cards,
.transport-studio .transport-data-pane__body .trip-ops-cards,
.payroll-studio .payroll-run-cards-grid,
.payroll-studio .employees-grid,
.payroll-studio .payroll-employees-grid,
.payroll-studio .directory-grid.portal-ops-cards,
.hiring-studio .hiring-cards.hiring-cards--candidates,
.hiring-studio .hiring-cards--candidates.portal-ops-cards,
.b2b-studio .b2b-operate__main .b2b-leads-mosaic,
.b2b-studio .b2b-leads-mosaic,
.admin-users-studio .user-grid,
.admin-users-studio .admin-users-list-shell .user-grid,
.admin-users-studio .admin-users-insights-grid,
.admin-users-studio .admin-users-command-grid,
.history-studio .history-fleet-log-grid,
.reports-studio .reports-export-grid,
.calendar-studio .calendar-side-grid {
  display: grid;
  grid-template-columns: var(--ops-tile-grid);
  justify-content: start;
  gap: var(--ops-cards-gap);
  width: 100%;
  min-width: 0;
}

.profile-studio .profile-stats-strip {
  display: grid;
  grid-template-columns: var(--ops-tile-grid-kpi);
  justify-content: start;
  gap: var(--ops-cards-gap);
  min-width: 0;
}

/* ── Nómina: liquidaciones compactas ── */
.payroll-run-card--compact {
  min-height: 0;
  padding: 0.55rem 0.72rem 0.5rem;
  gap: 0.36rem;
  border-radius: 12px;
}

.payroll-run-card--compact .payroll-run-card-head {
  padding: 0.35rem 0.35rem 0.25rem 0.85rem;
  gap: 0.4rem;
}

.payroll-run-card--compact .payroll-run-card-kicker {
  margin-bottom: 0.05rem;
  font-size: 0.62rem;
}

.payroll-run-card--compact .payroll-run-card-title {
  font-size: 0.88rem;
  line-height: 1.18;
}

.payroll-run-card--compact .payroll-run-card-chips {
  padding: 0 0.85rem 0.3rem;
  gap: 0.28rem;
}

.payroll-run-card--compact .payroll-run-amounts {
  border-top-width: 1px;
  border-bottom-width: 1px;
}

.payroll-run-card--compact .payroll-run-amount-col {
  padding: 0.38rem 0.42rem 0.38rem 0.65rem;
  gap: 0.12rem;
}

.payroll-run-card--compact .payroll-run-card-actions {
  gap: 0.28rem;
  padding: 0.35rem 0.5rem 0.4rem;
}

/* ── B2B: leads compactos ── */
.b2b-leads-card {
  padding: 0.62rem 0.78rem 0.58rem 0.88rem;
  border-radius: 12px;
  gap: 0.42rem;
  max-width: var(--ops-cards-max);
  width: 100%;
}

.b2b-leads-card-top {
  margin-bottom: 0.38rem;
  gap: 0.38rem;
}

.b2b-leads-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem;
  padding-top: 0.42rem;
}

.b2b-leads-brief {
  margin-top: 0.38rem;
  padding: 0.42rem 0.5rem;
  border-radius: 8px;
}

/* ── Historial: flota (combustible / taller) ── */
.history-fleet-log-card {
  display: grid;
  gap: 0.42rem;
  padding: 0.62rem 0.78rem 0.58rem 0.88rem;
  border: 1px solid #e8edf3;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(15, 35, 70, 0.07), 0 1px 3px rgba(15, 35, 70, 0.04);
  min-width: 0;
  max-width: var(--ops-cards-max);
  width: 100%;
  container-type: inline-size;
  container-name: ops-card;
  position: relative;
  overflow: hidden;
}

.history-fleet-log-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 12px 0 0 12px;
  background: var(--ops-card-accent, #1d63d3);
  pointer-events: none;
}

.history-fleet-log-card--fuel::before {
  background: #16a34a;
}

.history-fleet-log-card--technical::before {
  background: #6366f1;
}

.history-fleet-log-head {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.4rem;
  min-width: 0;
}

.history-fleet-log-date {
  display: block;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #6b7f96;
  margin-bottom: 0.12rem;
}

.history-fleet-log-plate {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 800;
  color: #0d2f5c;
  line-height: 1.15;
}

.history-fleet-log-sub,
.history-fleet-log-desc {
  margin: 0.12rem 0 0;
  font-size: 0.76rem;
  color: #64748b;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.history-fleet-log-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem;
  margin: 0;
  padding: 0;
}

.history-fleet-log-meta > div {
  display: grid;
  gap: 0.12rem;
  padding: 0.3rem 0.36rem;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
  min-width: 0;
}

.history-fleet-log-meta dt {
  margin: 0;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #8a96a8;
}

.history-fleet-log-meta dd {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 700;
  color: #152a44;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.history-fleet-log-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem;
  justify-content: flex-end;
}

.history-fleet-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.48rem;
  border-radius: 999px;
  font-size: 0.64rem;
  font-weight: 700;
  white-space: nowrap;
}

.history-fleet-badge--ok {
  background: rgba(16, 185, 129, 0.14);
  color: #047857;
}

.history-fleet-badge--warn {
  background: rgba(245, 158, 11, 0.16);
  color: #b45309;
}

.history-fleet-badge--type {
  background: rgba(99, 102, 241, 0.12);
  color: #4338ca;
}

.history-fleet-badge--status {
  background: rgba(55, 124, 192, 0.12);
  color: #1d4ed8;
}

/* ── Historial: trazabilidad (timeline) ── */
.history-studio.hist-trace-shell .hist-trace-card__body {
  padding: 0.55rem 0.72rem;
}

.history-studio.hist-trace-shell .hist-trace-card__title {
  font-size: 0.9rem;
  line-height: 1.2;
  margin: 0.2rem 0 0.15rem;
}

.history-studio.hist-trace-shell .hist-trace-card__summary {
  font-size: 0.78rem;
  line-height: 1.35;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.history-studio.hist-trace-shell .hist-trace-card__foot {
  margin-top: 0.35rem;
  gap: 0.35rem;
}

/* ── Notificaciones / avisos / timbre ── */
.notifications-studio .ntf-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: 52rem;
}

.notifications-studio .ntf-card {
  position: relative;
  padding: 0.55rem 0.72rem 0.55rem 0.88rem;
  gap: 0.42rem 0.58rem;
  align-items: center;
  border-radius: 10px;
  overflow: hidden;
}

.notifications-studio .ntf-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 10px 0 0 10px;
  background: #cbd5e1;
  pointer-events: none;
}

.notifications-studio .ntf-card--unread::before {
  background: linear-gradient(180deg, #6366f1, #4338ca);
}

/* ── Mi perfil: KPIs tipo ficha ── */
.profile-studio .profile-stat-card {
  position: relative;
  max-width: 14rem;
  width: 100%;
  padding: 0.55rem 0.68rem 0.55rem 0.82rem;
  border-radius: 10px;
  overflow: hidden;
}

.profile-studio .profile-stat-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 10px 0 0 10px;
  background: #4f46e5;
  pointer-events: none;
}

.profile-studio .profile-stat-card p {
  margin: 0 0 0.12rem;
  font-size: 0.62rem;
}

.profile-studio .profile-stat-card strong {
  font-size: 0.88rem;
  line-height: 1.2;
}

/* ── Usuarios: tarjetas comando / insight ── */
.admin-users-studio .admin-users-insight-card,
.admin-users-studio .admin-users-command-card {
  max-width: var(--ops-cards-max);
  width: 100%;
  padding: 0.62rem 0.78rem 0.58rem 0.88rem;
  border-radius: 12px;
  gap: 0.42rem;
}

/* ── SST y autorizaciones: paneles compactos ── */
.sst-studio .p-card,
.authorizations-studio .p-card {
  border-radius: 12px;
}

/* ── Acentos por estado (viajes / solicitudes / flota) ── */
.trip-ops-card--pendiente,
.request-ops-card.trip-ops-card--pendiente { --ops-card-accent: #f59e0b; }
.trip-ops-card--aprobada_pendiente_asignacion { --ops-card-accent: #2563eb; }
.trip-ops-card--viaje_asignado { --ops-card-accent: #16a34a; }
.trip-ops-card--en_transito { --ops-card-accent: #0284c7; }
.trip-ops-card--espera_standby { --ops-card-accent: #6366f1; }
.trip-ops-card--completada { --ops-card-accent: #0891b2; }
.trip-ops-card--cerrada { --ops-card-accent: #475569; }
.trip-ops-card--cancelada,
.trip-ops-card--rechazada,
.trip-ops-card--vencida { --ops-card-accent: #dc2626; }

.trip-ops-card--vehicle-disponible { --ops-card-accent: #16a34a; }
.trip-ops-card--vehicle-ocupado { --ops-card-accent: #ea580c; }
.trip-ops-card--vehicle-reservado { --ops-card-accent: #6366f1; }
.trip-ops-card--vehicle-no-disponible { --ops-card-accent: #d97706; }

/* ── Calendario: eventos del panel lateral ── */
.calendar-studio .cal-day-event,
.calendar-studio .cal-upcoming-item {
  padding: 0.42rem 0.55rem 0.42rem 0.68rem;
  border-radius: 9px;
  gap: 0.45rem;
}

@container ops-card (max-width: 22rem) {
  .b2b-leads-meta,
  .history-fleet-log-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Flota (camiones + conductores): fichas compactas ── */
.portal-ops-card.trip-ops-card--vehicle,
.portal-ops-card.trip-ops-card--driver {
  gap: 0.28rem;
  padding: 0.52rem 0.62rem 0.48rem 0.72rem;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-head,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-head {
  row-gap: 0.14rem;
  column-gap: 0.34rem;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-badges,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-badges {
  max-width: 6.75rem;
  flex: 0 0 auto;
  align-items: flex-end;
  gap: 0.2rem;
  min-width: 0;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-equip-pill--tk,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  padding: 0.2rem 0.4rem;
  min-height: 0;
  max-width: 100%;
  width: auto;
  border-radius: 999px;
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
  align-self: flex-end;
  line-height: 1.15;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-equip-pill--tk > span:not([class*="icon"]),
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill > span:not([class*="icon"]) {
  writing-mode: horizontal-tb;
  transform: none;
  max-height: none;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-equip-pill--tk .vehicle-card-equip-pill__icon,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill__icon,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill .portal-ops-card-doc-pill__icon {
  font-size: 0.62rem;
  line-height: 1;
  flex: 0 0 auto;
}

.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill__icon svg,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill .portal-ops-card-doc-pill__icon svg {
  width: 0.62rem;
  height: 0.62rem;
}

/* ── Camiones: detalle de cabecera y barra ── */
.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-kicker,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-kicker {
  margin-bottom: 0.06rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-plate-badge {
  width: 2.75rem;
  min-height: 2.55rem;
  padding: 0.26rem 0.2rem 0.22rem;
  border-radius: 9px;
  border-width: 1.5px;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-plate-badge__icon svg {
  width: 0.82rem;
  height: 0.82rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-plate-badge__text {
  margin-top: 0.08rem;
  font-size: 0.6rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-plate-title,
.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-title {
  font-size: 0.88rem;
  line-height: 1.18;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-year {
  margin: 0.04rem 0 0;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.12;
  color: #0d2f5c;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar {
  align-items: center;
  gap: 0.24rem;
  padding: 0.3rem 0.4rem;
  border-radius: 8px;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__main {
  flex: 1 1 42%;
  min-width: 0;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__copy strong {
  font-size: 0.68rem;
  line-height: 1.15;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__detail {
  font-size: 0.6rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__update {
  flex: 1 1 56%;
  min-width: 0;
  justify-items: end;
  gap: 0.06rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__update-label {
  font-size: 0.56rem;
  gap: 0.18rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__update-label svg {
  width: 0.68rem;
  height: 0.68rem;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-availability-bar__update strong {
  font-size: 0.6rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  text-align: right;
}

/* Texto siempre horizontal en tarjetas de flota (camiones + conductores) */
.portal-ops-card.trip-ops-card--vehicle,
.portal-ops-card.trip-ops-card--driver {
  writing-mode: horizontal-tb;
  text-orientation: mixed;
}

.portal-ops-card.trip-ops-card--vehicle :where(
  .trip-ops-card-head,
  .trip-ops-card-head *,
  .portal-ops-card-badges,
  .portal-ops-card-badges *,
  .vehicle-availability-bar,
  .vehicle-availability-bar *,
  .driver-trip-bar,
  .driver-trip-bar *,
  .driver-availability-bar,
  .driver-availability-bar *,
  .trip-ops-card-item,
  .trip-ops-card-item *,
  .portal-ops-card-actions,
  .portal-ops-card-actions *,
  .portal-ops-card-foot,
  .portal-ops-card-foot *
),
.portal-ops-card.trip-ops-card--driver :where(
  .trip-ops-card-head,
  .trip-ops-card-head *,
  .portal-ops-card-badges,
  .portal-ops-card-badges *,
  .vehicle-availability-bar,
  .vehicle-availability-bar *,
  .driver-trip-bar,
  .driver-trip-bar *,
  .driver-availability-bar,
  .driver-availability-bar *,
  .trip-ops-card-item,
  .trip-ops-card-item *,
  .portal-ops-card-actions,
  .portal-ops-card-actions *,
  .portal-ops-card-foot,
  .portal-ops-card-foot *
) {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-doc-pill,
.portal-ops-card.trip-ops-card--vehicle .vehicle-card-equip-pill,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-doc-pill,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill {
  flex-direction: row !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-doc-pill span,
.portal-ops-card.trip-ops-card--vehicle .vehicle-card-equip-pill span,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-doc-pill span,
.portal-ops-card.trip-ops-card--driver .driver-card-doc-pill span {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  transform: none !important;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-status-pill,
.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-status-pill__text,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-status-pill,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-status-pill__text {
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-spec-grid,
.portal-ops-card.trip-ops-card--driver .driver-card-spec-grid {
  gap: 0.2rem;
  align-items: start;
}

.portal-ops-card.trip-ops-card--vehicle .vehicle-card-spec-grid .trip-ops-card-item,
.portal-ops-card.trip-ops-card--driver .driver-card-spec-grid .trip-ops-card-item {
  gap: 0.06rem;
  padding: 0.24rem 0.32rem;
  border-radius: 7px;
  align-content: start;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-item-body,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-item-body {
  gap: 0.24rem;
  font-size: 0.68rem;
  align-items: center;
  line-height: 1.15;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-item-icon,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-item-icon {
  width: 1.2rem;
  height: 1.2rem;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-item-icon svg,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-item-icon svg {
  width: 0.65rem;
  height: 0.65rem;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-item-label,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-item-label {
  font-size: 0.55rem;
  line-height: 1.1;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-item-value,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-item-value {
  font-size: 0.66rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  word-break: normal;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar,
.portal-ops-card.trip-ops-card--driver .driver-availability-bar {
  padding: 0.3rem 0.4rem;
  gap: 0.24rem;
  border-radius: 8px;
  align-items: center;
  min-height: 0;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__main,
.portal-ops-card.trip-ops-card--driver .driver-availability-bar__main {
  gap: 0.32rem;
  align-items: center;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__icon {
  width: 1.35rem;
  height: 1.35rem;
  box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.12);
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__icon svg {
  width: 0.68rem;
  height: 0.68rem;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__copy {
  gap: 0.04rem;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__copy strong {
  font-size: 0.68rem;
  line-height: 1.15;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__copy span,
.portal-ops-card.trip-ops-card--driver .driver-availability-bar__detail {
  font-size: 0.6rem;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-ops-card.trip-ops-card--driver .driver-availability-bar__copy strong {
  font-size: 0.68rem;
  line-height: 1.15;
}

.portal-ops-card.trip-ops-card--driver .driver-trip-bar__map {
  flex: 0 0 auto;
  min-height: 1.55rem;
  padding: 0.22rem 0.32rem;
  font-size: 0.58rem;
  white-space: nowrap;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-actions,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-actions {
  gap: 0.18rem;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-actions-grid,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-actions-grid,
.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-actions-stack,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-actions-stack {
  gap: 0.24rem;
}

.portal-ops-card.trip-ops-card--vehicle .trip-ops-card-btn,
.portal-ops-card.trip-ops-card--driver .trip-ops-card-btn {
  min-height: 1.65rem;
  padding: 0.26rem 0.32rem;
  font-size: 0.62rem;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-foot,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-foot {
  padding-top: 0.22rem;
  margin-top: 0;
  font-size: 0.6rem;
  gap: 0.28rem;
}

.portal-ops-card-actions-stack {
  display: grid;
  gap: 0.32rem;
  width: 100%;
}

.portal-ops-card-actions-stack .trip-ops-card-btn,
.portal-ops-card-actions-stack .driver-card-status-btn {
  width: 100%;
}

.portal-ops-card.trip-ops-card--vehicle .portal-ops-card-status-pill__text,
.portal-ops-card.trip-ops-card--driver .portal-ops-card-status-pill__text {
  max-width: 7.5rem;
}

.portal-ops-card.trip-ops-card--driver .portal-ops-card-spec-sub {
  font-size: 0.56rem;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

.portal-ops-card.trip-ops-card--driver .portal-ops-card-spec-body {
  display: flex;
  flex-direction: column;
  gap: 0.04rem;
  min-width: 0;
  flex: 1 1 auto;
}

/* ── Conductores: acentos por estado ── */
.trip-ops-card--driver {
  --ops-card-accent: #ea580c;
}

.trip-ops-card--driver.trip-ops-card--driver-available {
  --ops-card-accent: #16a34a;
}

.trip-ops-card--driver.trip-ops-card--driver-busy {
  --ops-card-accent: #ea580c;
}

.trip-ops-card--driver.trip-ops-card--driver-scheduled {
  --ops-card-accent: #6366f1;
}

.trip-ops-card--driver.trip-ops-card--driver-offline {
  --ops-card-accent: #d97706;
}

.portal-ops-card.trip-ops-card--driver .driver-avatar,
.trip-ops-card-head--driver .driver-avatar {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 9px;
  font-size: 0.78rem;
}

.trip-ops-card--driver .driver-card-title,
.trip-ops-card--driver .trip-ops-card-title {
  font-size: 0.88rem;
  line-height: 1.18;
}

@media (max-width: 768px) {
  :root {
    --ops-cards-min: 16rem;
    --ops-cards-max: 100%;
  }
}

@media (max-width: 520px) {
  :root {
    --ops-cards-min: 100%;
    --ops-cards-max: 100%;
  }

  .directory-card__metrics--triple,
  .directory-card__metrics--quad {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body[data-theme="dark"] .portal-ops-card,
body[data-theme="dark"] .trip-ops-card,
body[data-theme="dark"] .directory-card:not(.directory-card--compact),
body[data-theme="dark"] .hiring-candidate-card {
  background: rgba(14, 28, 46, 0.92);
  border-color: rgba(148, 196, 255, 0.14);
}

body[data-theme="dark"] .trip-ops-card-title,
body[data-theme="dark"] .directory-card__title,
body[data-theme="dark"] .hiring-candidate-card__head h4 {
  color: #e6f1ff;
}

body[data-theme="dark"] .portal-ops-card-ref {
  background: rgba(15, 28, 46, 0.72);
  border-color: rgba(148, 196, 255, 0.14);
}

body[data-theme="dark"] .portal-ops-card-ref-label {
  color: #94a3b8;
}

body[data-theme="dark"] .portal-ops-card-ref-value {
  color: #dbeafe;
}

body[data-theme="dark"] .portal-ops-card-spec-grid .trip-ops-card-item,
body[data-theme="dark"] .trip-ops-card-grid .trip-ops-card-item,
body[data-theme="dark"] .directory-chip,
body[data-theme="dark"] .directory-card__fact,
body[data-theme="dark"] .hiring-candidate-card__meta > div {
  background: rgba(15, 28, 46, 0.55);
  border-color: rgba(148, 196, 255, 0.12);
}

body[data-theme="dark"] .trip-ops-card-route,
body[data-theme="dark"] .portal-ops-card-highlight,
body[data-theme="dark"] .directory-card__ops {
  background: rgba(15, 28, 46, 0.55);
  border-color: rgba(148, 196, 255, 0.12);
}

body[data-theme="dark"] .portal-ops-card-foot,
body[data-theme="dark"] .trip-ops-card-foot {
  border-top-color: rgba(148, 196, 255, 0.12);
  color: #94a8c0;
}

body[data-theme="dark"] .history-fleet-log-card {
  background: rgba(14, 28, 46, 0.92);
  border-color: rgba(148, 196, 255, 0.14);
}

body[data-theme="dark"] .history-fleet-log-plate {
  color: #e6f1ff;
}

body[data-theme="dark"] .history-fleet-log-meta > div {
  background: rgba(15, 28, 46, 0.55);
  border-color: rgba(148, 196, 255, 0.12);
}