.card__hd {
  padding: 12px 20px 6px 20px;
}

.card__title {
  margin: 0 0 4px 0;
}

.card__sub {
  margin: 0;
}

.card__bd {
  padding: 18px 20px 20px;
}



.dash-filter-card .dash-range-btn,
.dash-range-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 38px !important;
  min-width: 72px !important;
  padding: 6px 16px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(15, 23, 42, 0.18) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  text-decoration: none !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  transition: all .15s ease !important;
}

.dash-filter-card .dash-range-btn:hover,
.dash-range-btn:hover {
  text-decoration: none !important;
  transform: translateY(-1px);
  color: #0f172a !important;
}

.dash-filter-card .dash-range-btn.is-active,
.dash-range-btn.is-active {
  background: #0f172a !important;
  color: #ffffff !important;
  border-color: #0f172a !important;
}

.dash-filter-card .dash-range-btn.is-active:hover,
.dash-range-btn.is-active:hover {
  color: #ffffff !important;
}

/* Dashboard Productos - Movimiento */
.dash-card__value--product {
  font-size: 1.35rem;
  line-height: 1.15;
}

.dash-movement-tables {
  margin-top: 30px !important;
}

.dash-product-code {
  cursor: help;
  display: inline-flex;
  max-width: 100%;
}


/* Dashboard Productos - tablas de movimiento más compactas */
.dash-products-movement-table th,
.dash-products-movement-table td {
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 0.82rem;
  line-height: 1.22;
}

.dash-products-movement-table th {
  font-weight: 700;
}

.dash-products-movement-table td strong,
.dash-products-movement-table .dash-product-code {
  font-weight: 650;
}

.dash-products-movement-table .text-right {
  text-align: right;
}

.dash-products-movement-table th.text-right {
  text-align: right;
}

.dash-products-movement-table td.text-right {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* =========================
   Dashboard de Conductores
========================= */

.dashboard-drivers .dash-chart-box {
  height: 280px;
}

.driver-champion-card .card__bd {
  padding: 22px 24px;
}

.driver-champion {
  display: grid;
  gap: 18px;
}

.driver-champion__badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.10);
  border: 1px solid rgba(34, 197, 94, 0.25);
  color: #15803d;
  font-size: 0.82rem;
  font-weight: 800;
}

.driver-champion__main {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.driver-champion__name {
  font-size: 2rem;
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: var(--text, #0f172a);
}

.driver-champion__sub {
  margin-top: 8px;
  color: var(--muted, #64748b);
  font-size: 0.94rem;
}

.driver-champion__score {
  display: flex;
  align-items: baseline;
  gap: 4px;
  color: #8ec5ff;
  font-weight: 900;
}

.driver-champion__score span {
  font-size: 3.3rem;
  line-height: 0.9;
  letter-spacing: -0.06em;
}

.driver-champion__score small {
  font-size: 1rem;
  color: var(--muted, #64748b);
  font-weight: 800;
}

.driver-champion__metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.driver-champion__metrics div {
  padding: 12px 14px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 14px;
  background: rgba(248, 250, 252, 0.72);
}

.driver-champion__metrics strong,
.driver-champion__metrics span {
  display: block;
}

.driver-champion__metrics strong {
  font-size: 1.15rem;
  line-height: 1.1;
  color: var(--text, #0f172a);
}

.driver-champion__metrics span {
  margin-top: 4px;
  font-size: 0.78rem;
  color: var(--muted, #64748b);
}

.driver-champion--empty .driver-champion__name {
  font-size: 1.5rem;
}

.driver-rules {
  display: grid;
  gap: 10px;
  font-size: 0.92rem;
  color: var(--text, #0f172a);
}

.driver-rules strong {
  font-weight: 800;
}

.driver-weights {
  display: grid;
  gap: 10px;
}

.driver-weight {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.driver-weight:last-child {
  border-bottom: 0;
}

.driver-weight strong,
.driver-weight span {
  display: block;
}

.driver-weight strong {
  font-size: 0.9rem;
}

.driver-weight span {
  margin-top: 3px;
  color: var(--muted, #64748b);
  font-size: 0.82rem;
}

.driver-weight b {
  font-size: 0.95rem;
  color: #8ec5ff;
  white-space: nowrap;
}

.driver-score-table {
  font-size: 0.84rem;
}

.driver-score-table th,
.driver-score-table td {
  padding-top: 9px;
  padding-bottom: 9px;
  vertical-align: middle;
}

.driver-score-table th:not(:nth-child(2)),
.driver-score-table td.driver-score-table__num {
  text-align: right;
}

.driver-score-table th:first-child,
.driver-score-table td:first-child {
  width: 46px;
  text-align: right;
}

.driver-score-table .badge {
  white-space: nowrap;
}

.dash-list__label small {
  display: block;
  margin-top: 3px;
  color: var(--muted, #64748b);
  font-size: 0.78rem;
}

@media (max-width: 1180px) {
  .driver-champion__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .driver-champion__metrics {
    grid-template-columns: 1fr;
  }

  .driver-champion__score span {
    font-size: 2.6rem;
  }
}

/* Dashboard conductores - acción de felicitación */
.driver-champion__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.10);
}

.driver-champion__email-hint {
  color: var(--muted, #94a3b8);
  font-size: 0.86rem;
}

@media (max-width: 640px) {
  .driver-champion__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .driver-champion__actions .btn {
    width: 100%;
    justify-content: center;
  }
}


/* Driver load validation - observación por producto */
.driver-load-table--observations th,
.driver-load-table--observations td {
  vertical-align: middle;
}

.driver-load-table--observations .text-right {
  text-align: right;
}

.driver-load-observation {
  min-width: 220px;
  min-height: 44px;
  height: 44px;
  resize: vertical;
  font-size: 12px;
  line-height: 1.35;
  padding-top: 8px;
  padding-bottom: 8px;
}

.driver-load-table--observations .driver-load-qty {
  max-width: 120px;
}

@media (max-width: 900px) {
  .driver-load-observation,
  .driver-load-table--observations .driver-load-qty {
    width: 100%;
    max-width: 100%;
  }
}


/* Historial operativo de rutas */
.route-operational-history__body {
  display: grid;
  gap: 18px;
}

.route-operational-history__section {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel-2);
  padding: 14px;
}

.route-operational-history__section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.route-operational-history__title {
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
}

.route-operational-history__sub {
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.route-load-history-table th,
.route-load-history-table td {
  vertical-align: middle;
}

.route-load-history-table .text-right {
  text-align: right;
}


/* =========================
   Historial operativo - fuente compacta
========================= */

.route-history,
.route-history__item,
.route-history__compare,
.route-history__col,
.route-history__list,
.route-history__list li,
.route-history__meta,
.route-history__time,
.route-history__date,
.route-history__user {
  font-size: 12px;
}

.route-history__label {
  font-size: 11px;
}

.route-history__head {
  margin-bottom: 8px;
}

.route-history__item {
  padding: 11px 12px;
  border-radius: 14px;
}

.route-history__col {
  padding: 10px;
}

.route-history__list {
  gap: 4px;
}

/* Ajustes de carga dentro del historial operativo */

/* Bloque general */
.route-history,
.operational-history,
.historial-operativo,
.route-operational-history {
  font-size: 12px !important;
  line-height: 1.28 !important;
}

/* Tarjetas internas del historial */
.route-history__item,
.operational-history__item,
.historial-operativo__item,
.route-operational-history__item {
  padding: 9px 10px !important;
  border-radius: 12px !important;
}

.route-history__head,
.operational-history__head,
.historial-operativo__head,
.route-operational-history__head {
  margin-bottom: 7px !important;
  gap: 8px !important;
}

/* Títulos, usuario, fecha y hora */
.route-history__user,
.route-history__date,
.route-history__time,
.route-history__label,
.operational-history strong,
.operational-history span,
.historial-operativo strong,
.historial-operativo span,
.route-operational-history strong,
.route-operational-history span {
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}

.route-history__user,
.operational-history strong,
.historial-operativo strong,
.route-operational-history strong {
  font-weight: 600 !important;
}

.route-history__date,
.route-history__time,
.operational-history small,
.historial-operativo small,
.route-operational-history small {
  font-size: 11px !important;
  opacity: .78 !important;
}

/* Comparación antes/después */
.route-history__compare {
  gap: 8px !important;
}

.route-history__col {
  padding: 8px 9px !important;
  border-radius: 10px !important;
}

.route-history__label {
  margin-bottom: 5px !important;
  font-size: 10.5px !important;
  letter-spacing: .035em !important;
}

.route-history__list {
  gap: 3px !important;
  padding-left: 15px !important;
}

.route-history__list li {
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}

/* Ajustes de carga - tablas/listas dentro del historial operativo */
.historial-operativo table,
.operational-history table,
.route-operational-history table,
.route-history table {
  font-size: 11.5px !important;
}

.historial-operativo th,
.historial-operativo td,
.operational-history th,
.operational-history td,
.route-operational-history th,
.route-operational-history td,
.route-history th,
.route-history td {
  padding: 6px 8px !important;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
}

.historial-operativo th,
.operational-history th,
.route-operational-history th,
.route-history th {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .035em !important;
}

/* Badges dentro del historial */
.historial-operativo .badge,
.operational-history .badge,
.route-operational-history .badge,
.route-history .badge {
  min-height: 20px !important;
  padding: 2px 7px !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}

/* Textos descriptivos */
.historial-operativo p,
.operational-history p,
.route-operational-history p,
.route-history p,
.historial-operativo .muted,
.operational-history .muted,
.route-operational-history .muted,
.route-history .muted {
  font-size: 11.5px !important;
  line-height: 1.3 !important;
  margin-top: 3px !important;
  margin-bottom: 3px !important;
}

/* Si el bloque de ajustes usa clases específicas generadas en la vista */
.load-adjustments,
.load-adjustments * {
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}

.load-adjustments__item {
  padding: 8px 9px !important;
  border-radius: 10px !important;
}

.load-adjustments__title {
  font-size: 12px !important;
  font-weight: 600 !important;
}

.load-adjustments__meta,
.load-adjustments__desc,
.load-adjustments__obs {
  font-size: 11.5px !important;
}


/* Conductor - bloqueo por evidencia pendiente */
.driver-stop-evidence-lock {
  margin-top: 14px;
  font-size: 13px;
  line-height: 1.35;
}

.driver-stop-card .driver-stop-card__badges .badge {
  white-space: nowrap;
}



/* Conductor - bloqueo de movimiento por horario definido */
.driver-stop-card.is-locked-time {
  cursor: not-allowed;
}

.driver-stop-card.is-locked-time .driver-stop-card__top {
  cursor: not-allowed;
}

.driver-stop-card__movehint--locked {
  background: rgba(245, 158, 11, 0.14);
  border-color: rgba(245, 158, 11, 0.34);
  color: #92400e;
}

.driver-stop-time-lock {
  margin-top: 12px;
  font-size: 12px;
  padding: 8px 10px;
}


/* =========================
   Materiales
========================= */
.materials-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.materials-form-row {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 180px 160px;
  gap: 14px;
  margin-bottom: 14px;
}

.materials-table th.col-unidad,
.materials-table td.col-unidad {
  width: 120px;
  white-space: nowrap;
}

.driver-materials-summary {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255,255,255,.03);
}

.driver-materials-summary__title {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 8px;
}

.driver-materials-list {
  display: grid;
  gap: 6px;
}

.driver-materials-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
}

.driver-materials-item strong {
  font-weight: 800;
}

.driver-materials-help {
  margin-bottom: 14px;
  color: var(--muted);
  font-size: 13px;
}

.driver-materials-rows {
  display: grid;
  gap: 12px;
}

.driver-material-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 130px minmax(240px, 1.2fr);
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--panel-2);
}

.driver-materials-actions {
  margin-top: 14px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.route-materials-list {
  display: grid;
  gap: 10px;
}

.route-materials-item {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255,255,255,.03);
}

.route-materials-item__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.route-materials-item__lines {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.route-materials-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255,255,255,.04);
  font-size: 12px;
}

@media (max-width: 900px) {
  .materials-form-row,
  .driver-material-row {
    grid-template-columns: 1fr;
  }

  .driver-materials-actions {
    justify-content: stretch;
  }

  .driver-materials-actions .btn {
    width: 100%;
  }
}

/* =========================
   Pickup tablet
========================= */
.pickup-tablet-page {
  padding: 16px;
}

.pickup-tablet-hero__row,
.pickup-tablet-card__head,
.pickup-tablet-card__actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.pickup-tablet-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.pickup-tablet-card.is-done {
  opacity: .72;
}

.pickup-tablet-card__title {
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--text);
}

.pickup-tablet-products,
.pickup-evid-products {
  display: grid;
  gap: 6px;
  margin-top: 14px;
}

.pickup-tablet-product,
.pickup-evid-product {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(148, 163, 184, .14);
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  font-size: 13px;
}

.pickup-tablet-product strong,
.pickup-evid-product strong {
  font-weight: 800;
}

.pickup-tablet-product span,
.pickup-evid-product span {
  white-space: nowrap;
  text-align: right;
  font-weight: 700;
}

.pickup-tablet-card__actions {
  margin-top: 14px;
  align-items: center;
}

@media (max-width: 980px) {
  .pickup-tablet-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pickup-tablet-page {
    padding: 10px;
  }

  .pickup-tablet-product,
  .pickup-evid-product {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .pickup-tablet-product span,
  .pickup-evid-product span {
    text-align: left;
  }

  .pickup-tablet-card__actions .btn,
  .driver-route-summary__actions .btn {
    width: 100%;
  }
}


/* Evidencias - Deliveries / Pickups */
.evidencias-tabs {
  margin-top: 0;
}

.evidencias-page .toolbar-inline {
  margin-bottom: 12px;
}

.evidencias-table .cell-title {
  font-size: 13px;
}

.evidencias-table .cell-sub {
  font-size: 12px;
}

.evidencia-detail-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.evidencia-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}

.evidencia-detail-label {
  font-size: 12px;
}

.evidencia-detail-full {
  grid-column: 1 / -1;
}

.evidencia-detail-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.evidencia-sign-img {
  max-width: 100%;
  background: #fff;
  border-radius: 12px;
  padding: 10px;
}

.evidencia-photo-img {
  max-width: 100%;
  border-radius: 12px;
}

/* =========================
   Empresas - CRUD super admin
========================= */

.empresas-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.empresas-filters {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 130px 80px auto auto 1fr;
  gap: 10px;
  align-items: center;
}

.empresas-filters .input--estado {
  width: 130px;
}

.empresas-filters .input--perpage {
  width: 80px;
}

.empresas-table th.col-estado,
.empresas-table td.col-estado {
  width: 110px;
  white-space: nowrap;
}

.empresas-table th.col-acciones,
.empresas-table td.col-acciones {
  width: 130px;
  white-space: nowrap;
}

.empresas-color-chip {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted, #64748b);
}

.empresas-form {
  display: grid;
  gap: 16px;
}

.empresas-form-card .card__bd {
  display: grid;
  gap: 14px;
}

.empresas-form-row {
  display: grid;
  gap: 14px;
  align-items: end;
}

.empresas-form-row--main {
  grid-template-columns: minmax(260px, 1.4fr) minmax(220px, 1fr) 180px 140px;
}

.empresas-form-row--contact {
  grid-template-columns: 170px minmax(260px, 1.4fr) 160px 160px 120px 110px;
}

.empresas-form-row--branding {
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.4fr) minmax(220px, 1fr) 190px;
}

.empresas-form-row--emails {
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

.empresas-color-field {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.empresas-color-input {
  width: 44px;
  height: 38px;
  padding: 0;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
}

.empresas-email-input {
  min-height: 68px;
}

.empresas-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 1200px) {
  .empresas-form-row--main,
  .empresas-form-row--contact,
  .empresas-form-row--branding,
  .empresas-form-row--emails {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .empresas-filters {
    grid-template-columns: 1fr 130px 80px auto auto;
  }

  .empresas-filters .toolbar-inline__actions {
    grid-column: 1 / -1;
    justify-self: end;
  }
}

@media (max-width: 760px) {
  .empresas-form-row--main,
  .empresas-form-row--contact,
  .empresas-form-row--branding,
  .empresas-form-row--emails,
  .empresas-filters {
    grid-template-columns: 1fr;
  }

  .empresas-filters .input--estado,
  .empresas-filters .input--perpage {
    width: 100%;
  }

  .empresas-filters .toolbar-inline__actions,
  .empresas-form-actions {
    justify-self: stretch;
    justify-content: stretch;
  }

  .empresas-filters .toolbar-inline__actions .btn,
  .empresas-form-actions .btn {
    width: 100%;
  }
}


/* =========================
   RutaControl - Tema claro / oscuro
========================= */

html[data-theme="light"],
body[data-theme="light"] {
  --bg: #f5f7fb;
  --panel: #ffffff;
  --panel-2: #f8fafc;
  --text: #101828;
  --muted: #667085;
  --line: #e5e7eb;
  --border: #e5e7eb;
  --accent: #0f172a;
  --primary: #2563eb;
  --success: #16a34a;
  --warning: #d97706;
  --danger: #dc2626;
}

html[data-theme="dark"],
body[data-theme="dark"] {
  --bg: #0b1220;
  --panel: #111827;
  --panel-2: #162033;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --line: rgba(148, 163, 184, 0.22);
  --border: rgba(148, 163, 184, 0.22);
  --accent: #4f8cff;
  --primary: #4f8cff;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
}

html,
body {
  background: var(--bg);
  color: var(--text);
}

body.app-body {
  background: var(--bg);
  color: var(--text);
}

.app-main,
.content {
  background: var(--bg);
  color: var(--text);
}

.card,
.dash-card,
.ops-metric,
.stack-item,
.delivery-state-item,
.route-history__item,
.route-history__col,
.dash-insight,
.dash-pill,
.pickups-pagination,
.preview-pagination,
.preview-pill,
.route-materials-item,
.operational-history,
.operational-history__section,
.operational-history__item {
  background: var(--panel);
  border-color: var(--line);
  color: var(--text);
}

.card__sub,
.cell-sub,
.muted,
.dash-mini,
.dash-kicker,
.dash-kpi__label,
.dash-kpi__sub,
.stack-item__desc,
.delivery-state-total,
.table-footer__info,
.pagination__current,
.field__help,
.sidebar__meta,
.sidebar__workspace,
.sidebar__tagline,
.breadcrumbs,
.breadcrumbs__current {
  color: var(--muted) !important;
}

.sidebar {
  background: var(--panel);
  border-right: 1px solid var(--line);
  color: var(--text);
}

.sidebar__brand,
.topbar__title,
.card__title,
.dash-section-title {
  color: var(--text);
}

.sidebar__link {
  color: var(--muted);
}

.sidebar__link:hover,
.sidebar__link.is-active {
  background: var(--panel-2);
  color: var(--text);
}

.topbar {
  background: var(--panel);
  border-bottom: 1px solid var(--line);
  color: var(--text);
}

.breadcrumbs__link {
  color: var(--primary);
}

.table,
table {
  color: var(--text);
}

.table th,
table th {
  color: var(--muted);
  border-color: var(--line);
}

.table td,
table td {
  border-color: var(--line);
}

.input,
select,
textarea,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="time"],
input[type="number"] {
  background: var(--panel-2);
  border-color: var(--line);
  color: var(--text);
}

.input::placeholder,
textarea::placeholder,
input::placeholder {
  color: var(--muted);
}

.btn--ghost {
  border-color: var(--line);
  color: var(--text);
  background: transparent;
}

.btn--ghost:hover {
  background: var(--panel-2);
  color: var(--text);
}

.theme-toggle {
  min-width: 104px;
  white-space: nowrap;
}

body[data-theme="dark"] .card,
body[data-theme="dark"] .dash-card,
body[data-theme="dark"] .ops-metric,
body[data-theme="dark"] .stack-item,
body[data-theme="dark"] .delivery-state-item,
body[data-theme="dark"] .route-history__item,
body[data-theme="dark"] .route-history__col,
body[data-theme="dark"] .dash-insight,
body[data-theme="dark"] .dash-pill,
body[data-theme="dark"] .pickups-pagination,
body[data-theme="dark"] .preview-pagination,
body[data-theme="dark"] .preview-pill,
body[data-theme="dark"] .route-materials-item,
body[data-theme="dark"] .operational-history,
body[data-theme="dark"] .operational-history__section,
body[data-theme="dark"] .operational-history__item {
  box-shadow: none;
}

body[data-theme="dark"] .dash-filter-card .dash-range-btn,
body[data-theme="dark"] .dash-range-btn {
  background: #111827 !important;
  color: #e5e7eb !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
}

body[data-theme="dark"] .dash-filter-card .dash-range-btn:hover,
body[data-theme="dark"] .dash-range-btn:hover {
  background: #1f2937 !important;
  color: #ffffff !important;
}

body[data-theme="dark"] .dash-filter-card .dash-range-btn.is-active,
body[data-theme="dark"] .dash-range-btn.is-active {
  background: var(--primary) !important;
  color: #ffffff !important;
  border-color: var(--primary) !important;
}

body[data-theme="dark"] .file-drop {
  background: #111827;
  color: #e5e7eb;
  border-color: rgba(148, 163, 184, 0.28);
}

body[data-theme="dark"] .file-drop__text {
  color: #e5e7eb;
}

body[data-theme="dark"] .alert {
  border-color: var(--line);
}

body[data-theme="dark"] .pac-container {
  background: #111827;
  border-color: rgba(255,255,255,0.08);
}

body[data-theme="dark"] .pac-item {
  color: #e5e7eb;
}

body[data-theme="dark"] .pac-item-query {
  color: #ffffff;
}


/* =====================================================
   RutaControl - Theme contrast fixes v2
   Ajustes para modo claro/oscuro: dashboards, tablas y sidebar
===================================================== */

/* ---------- Tabs / botones de dashboards ---------- */
[data-theme="dark"] .dash-tab,
[data-theme="dark"] .evid-tab,
[data-theme="dark"] .dashboard-tab {
  background: rgba(148, 163, 184, 0.16) !important;
  border-color: rgba(203, 213, 225, 0.36) !important;
  color: #dbeafe !important;
  box-shadow: none !important;
}

[data-theme="dark"] .dash-tab:hover,
[data-theme="dark"] .evid-tab:hover,
[data-theme="dark"] .dashboard-tab:hover {
  background: rgba(148, 163, 184, 0.26) !important;
  border-color: rgba(203, 213, 225, 0.52) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .dash-tab.is-active,
[data-theme="dark"] .evid-tab.is-active,
[data-theme="dark"] .dashboard-tab.is-active,
[data-theme="dark"] .dash-tabs .is-active {
  background: #3b82f6 !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

[data-theme="light"] .dash-tab,
[data-theme="light"] .evid-tab,
[data-theme="light"] .dashboard-tab {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #334155 !important;
}

[data-theme="light"] .dash-tab:hover,
[data-theme="light"] .evid-tab:hover,
[data-theme="light"] .dashboard-tab:hover {
  background: #e2e8f0 !important;
  border-color: #94a3b8 !important;
  color: #0f172a !important;
}

[data-theme="light"] .dash-tab.is-active,
[data-theme="light"] .evid-tab.is-active,
[data-theme="light"] .dashboard-tab.is-active,
[data-theme="light"] .dash-tabs .is-active {
  background: #0f172a !important;
  border-color: #0f172a !important;
  color: #ffffff !important;
}

/* ---------- Tablas en modo oscuro ---------- */
[data-theme="dark"] .table,
[data-theme="dark"] .table--nexo,
[data-theme="dark"] table {
  color: #e5e7eb !important;
}

[data-theme="dark"] .table thead th,
[data-theme="dark"] .table--nexo thead th,
[data-theme="dark"] table thead th {
  background: #172033 !important;
  color: #cbd5e1 !important;
  border-bottom-color: rgba(148, 163, 184, 0.26) !important;
}

[data-theme="dark"] .table tbody td,
[data-theme="dark"] .table--nexo tbody td,
[data-theme="dark"] table tbody td {
  background: #111827 !important;
  color: #e5e7eb !important;
  border-bottom-color: rgba(148, 163, 184, 0.16) !important;
}

[data-theme="dark"] .table tbody tr:hover td,
[data-theme="dark"] .table--nexo tbody tr:hover td,
[data-theme="dark"] table tbody tr:hover td {
  background: #1e293b !important;
}

[data-theme="dark"] .table a,
[data-theme="dark"] .table--nexo a,
[data-theme="dark"] table a {
  color: #93c5fd !important;
}

[data-theme="dark"] .cell-sub,
[data-theme="dark"] .muted,
[data-theme="dark"] .card__sub,
[data-theme="dark"] .dash-mini,
[data-theme="dark"] .dash-kicker,
[data-theme="dark"] .table .cell-sub,
[data-theme="dark"] .table--nexo .cell-sub {
  color: #a8b3c7 !important;
}

[data-theme="dark"] .table strong,
[data-theme="dark"] .table--nexo strong,
[data-theme="dark"] table strong {
  color: #f8fafc !important;
}

/* ---------- Inputs / filtros en modo oscuro ---------- */
[data-theme="dark"] .input,
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: #111827 !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .input::placeholder,
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #93a4bd !important;
}

[data-theme="dark"] select option {
  background: #111827;
  color: #e5e7eb;
}

/* ---------- Botones secundarios / paginación en oscuro ---------- */
[data-theme="dark"] .btn--ghost,
[data-theme="dark"] .btn:not(.btn--primary):not(.btn--danger):not(.btn--success),
[data-theme="dark"] .pagination .btn,
[data-theme="dark"] .table-footer .btn {
  background: #111827 !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .btn--ghost:hover,
[data-theme="dark"] .btn:not(.btn--primary):not(.btn--danger):not(.btn--success):hover,
[data-theme="dark"] .pagination .btn:hover,
[data-theme="dark"] .table-footer .btn:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

[data-theme="dark"] .btn.is-disabled,
[data-theme="dark"] .btn:disabled {
  background: #0f172a !important;
  color: #64748b !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}

/* ---------- Sidebar modo claro ---------- */
[data-theme="light"] .sidebar {
  background: #ffffff !important;
  border-right: 1px solid #e2e8f0 !important;
}

[data-theme="light"] .sidebar__brand,
[data-theme="light"] .sidebar__title,
[data-theme="light"] .sidebar h1,
[data-theme="light"] .sidebar strong {
  color: #0f172a !important;
}

[data-theme="light"] .sidebar__sub,
[data-theme="light"] .sidebar__user-role,
[data-theme="light"] .sidebar .muted {
  color: #475569 !important;
}

[data-theme="light"] .sidebar__link {
  color: #475569 !important;
  background: transparent !important;
}

[data-theme="light"] .sidebar__link:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

[data-theme="light"] .sidebar__link.is-active,
[data-theme="light"] .sidebar__link[aria-current="page"] {
  background: #0f172a !important;
  color: #ffffff !important;
}

/* ---------- Sidebar modo oscuro ---------- */
[data-theme="dark"] .sidebar {
  background: #0f172a !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
}

[data-theme="dark"] .sidebar__brand,
[data-theme="dark"] .sidebar__title,
[data-theme="dark"] .sidebar h1,
[data-theme="dark"] .sidebar strong {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar__sub,
[data-theme="dark"] .sidebar__user-role,
[data-theme="dark"] .sidebar .muted {
  color: #a8b3c7 !important;
}

[data-theme="dark"] .sidebar__link {
  color: #cbd5e1 !important;
  background: transparent !important;
}

[data-theme="dark"] .sidebar__link:hover {
  background: rgba(148, 163, 184, 0.14) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar__link.is-active,
[data-theme="dark"] .sidebar__link[aria-current="page"] {
  background: #3b82f6 !important;
  color: #ffffff !important;
}

/* ---------- Cards / contenedores modo oscuro ---------- */
[data-theme="dark"] .card,
[data-theme="dark"] .dash-card,
[data-theme="dark"] .pickups-index-card,
[data-theme="dark"] .table-footer,
[data-theme="dark"] .pagination-wrap,
[data-theme="dark"] .pickups-pagination {
  background: #111827 !important;
  border-color: rgba(148, 163, 184, 0.20) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .card__title,
[data-theme="dark"] .dash-section-title,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3 {
  color: #f8fafc !important;
}


/* =====================================================
   Theme contrast fix - Labels / nombres de campos
   Aplica a create/edit/forms en modo claro y oscuro
===================================================== */

/* Modo oscuro: labels más visibles */
[data-theme="dark"] label,
[data-theme="dark"] .label,
[data-theme="dark"] .field label,
[data-theme="dark"] .field__label,
[data-theme="dark"] .form-label,
[data-theme="dark"] .form-grid label,
[data-theme="dark"] .input-label {
  color: #dbeafe !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

/* Textos de ayuda debajo de campos */
[data-theme="dark"] .field__help,
[data-theme="dark"] .form-help,
[data-theme="dark"] .help,
[data-theme="dark"] small,
[data-theme="dark"] .muted {
  color: #b6c2d4 !important;
  opacity: 1 !important;
}

/* Placeholders */
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

/* Inputs / selects / textareas */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] .input {
  color: #ffffff !important;
  background: #111827 !important;
  border-color: rgba(203, 213, 225, 0.28) !important;
}

/* Select options */
[data-theme="dark"] select option {
  color: #0f172a !important;
  background: #ffffff !important;
}

/* Modo claro: asegurar contraste de labels también */
[data-theme="light"] label,
[data-theme="light"] .label,
[data-theme="light"] .field label,
[data-theme="light"] .field__label,
[data-theme="light"] .form-label,
[data-theme="light"] .form-grid label,
[data-theme="light"] .input-label {
  color: #334155 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

/* Modo claro: ayudas */
[data-theme="light"] .field__help,
[data-theme="light"] .form-help,
[data-theme="light"] .help,
[data-theme="light"] small,
[data-theme="light"] .muted {
  color: #64748b !important;
  opacity: 1 !important;
}

/* =====================================================
   Theme dark - Badges neutros más legibles
   Ajuste puntual para columnas Visual / Sistema
===================================================== */

[data-theme="dark"] .badge--neutral,
[data-theme="dark"] .badge--dark {
  color: #e5e7eb !important;
  background: rgba(148, 163, 184, 0.18) !important;
  border-color: rgba(203, 213, 225, 0.34) !important;
}

[data-theme="dark"] .badge--neutral:hover,
[data-theme="dark"] .badge--dark:hover {
  color: #ffffff !important;
  background: rgba(148, 163, 184, 0.24) !important;
  border-color: rgba(203, 213, 225, 0.42) !important;
}

/* =====================================================
   RutaControl - Tema guardado por usuario
===================================================== */

.theme-form {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.theme-form .theme-toggle,
.theme-toggle {
  min-width: 104px;
  white-space: nowrap;
}


/* =====================================================
   RutaControl - Warehouse / Packing Sheets
===================================================== */

.packing-sheets-page,
.warehouse-tablet-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.warehouse-filters {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 150px 140px 160px 90px auto auto 1fr;
  gap: 8px;
  align-items: center;
  width: 100%;
}

.warehouse-create-search {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.warehouse-inline-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.warehouse-pallet-input {
  width: 100px;
}

.warehouse-progress {
  width: 100%;
  height: 8px;
  background: rgba(148, 163, 184, 0.18);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 8px;
}

.warehouse-progress span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--accent, #2563eb);
  transition: width .2s ease;
}

.warehouse-progress--lg {
  height: 14px;
  margin-top: 16px;
}

.warehouse-sheet-head,
.warehouse-sheet-tablet-head,
.warehouse-header,
.warehouse-tablet-card__top,
.warehouse-separation-card__head,
.warehouse-item-card__head,
.warehouse-total-progress__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.warehouse-title,
.warehouse-tablet-card h2,
.warehouse-separation-card h2 {
  margin: 0;
}

.warehouse-sheet-actions,
.warehouse-tablet-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.warehouse-kpis {
  margin-top: 16px;
}

.warehouse-state-text {
  font-size: 1.25rem !important;
  text-transform: capitalize;
}

.warehouse-items-logistica,
.warehouse-item-list {
  display: grid;
  gap: 14px;
}

.warehouse-item-card,
.warehouse-separation-card {
  border: 1px solid var(--line, rgba(148,163,184,.22));
  border-radius: 16px;
  padding: 14px;
  background: var(--panel-2, rgba(255,255,255,.03));
}

.warehouse-item-card__head,
.warehouse-separation-card__head {
  align-items: center;
}

.warehouse-count {
  font-size: .95rem;
  white-space: nowrap;
}

.warehouse-count--big {
  font-size: 1.35rem;
}

.warehouse-count strong {
  font-weight: 900;
}

.warehouse-item-note {
  margin-top: 8px;
}

.warehouse-checks {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}

.warehouse-check-form {
  margin: 0;
}

.warehouse-check {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  border: 1px solid rgba(148,163,184,.35);
  background: rgba(255,255,255,.04);
  color: var(--text, #0f172a);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  user-select: none;
}

.warehouse-check.is-checked {
  background: rgba(34,197,94,.18);
  border-color: rgba(34,197,94,.50);
  color: #16a34a;
  box-shadow: 0 0 0 2px rgba(34,197,94,.08);
}

.warehouse-checks--readonly .warehouse-check {
  cursor: default;
}

.warehouse-tablet-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.warehouse-tablet-card .card__bd {
  display: grid;
  gap: 16px;
}

.warehouse-tablet-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.warehouse-tablet-meta > div {
  border: 1px solid var(--line, rgba(148,163,184,.22));
  border-radius: 14px;
  padding: 10px 12px;
  background: var(--panel-2, rgba(255,255,255,.03));
}

.warehouse-tablet-meta span {
  display: block;
  font-size: 12px;
  color: var(--muted, #64748b);
  margin-bottom: 4px;
}

.warehouse-tablet-meta strong {
  font-size: 18px;
}

.warehouse-general-note .input--textarea {
  min-height: 90px;
}

.warehouse-item-form {
  margin-top: 14px;
}

.warehouse-item-form__grid {
  display: grid;
  grid-template-columns: minmax(160px, .45fr) minmax(240px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.warehouse-complete-card {
  position: sticky;
  bottom: 14px;
  z-index: 5;
}

.warehouse-complete-help {
  margin-top: 8px;
  text-align: center;
}

[data-theme="dark"] .warehouse-check {
  color: #e5e7eb;
  background: rgba(15, 23, 42, .72);
}

[data-theme="dark"] .warehouse-check.is-checked {
  color: #bbf7d0;
}

.text-right {
  text-align: right;
}

@media (max-width: 1100px) {
  .warehouse-filters {
    grid-template-columns: 1fr 1fr;
  }

  .warehouse-tablet-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .warehouse-filters,
  .warehouse-create-search,
  .warehouse-item-form__grid,
  .warehouse-tablet-meta {
    grid-template-columns: 1fr;
  }

  .warehouse-check {
    width: 36px;
    height: 36px;
  }

  .warehouse-sheet-actions,
  .warehouse-sheet-actions .btn,
  .warehouse-tablet-actions .btn {
    width: 100%;
  }
}


/* =====================================================
   Warehouse - distribución de pallets por producto
===================================================== */

.warehouse-pallets-cell {
  display: grid;
  gap: 6px;
  min-width: 220px;
}

.warehouse-pallets-cell__top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.warehouse-pallets-cell__top strong {
  font-size: 14px;
  font-weight: 900;
}

.warehouse-pallets-cell__top span {
  font-size: 12px;
  color: var(--muted, #64748b);
  font-weight: 700;
}

.warehouse-progress--pallets {
  max-width: 240px;
}

.warehouse-pallets-products {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.warehouse-pallets-products span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(148, 163, 184, 0.10);
  color: var(--text, #0f172a);
  font-size: 12px;
  font-weight: 800;
}

.warehouse-pallet-summary {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.warehouse-pallet-summary > div {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line, #e5e7eb);
  background: rgba(148, 163, 184, 0.08);
}

.warehouse-pallet-summary span {
  display: block;
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.warehouse-pallet-summary strong {
  display: block;
  margin-top: 4px;
  color: var(--text, #0f172a);
  font-size: 24px;
  font-weight: 900;
}

.warehouse-item-form__grid--pallets {
  grid-template-columns: minmax(150px, 190px) minmax(180px, 1fr) minmax(220px, 1.3fr) auto;
}

.warehouse-item-pallet-note {
  margin-top: 8px;
  color: var(--muted, #64748b);
  font-size: 13px;
  font-weight: 700;
}

@media (max-width: 980px) {
  .warehouse-item-form__grid--pallets,
  .warehouse-pallet-summary {
    grid-template-columns: 1fr;
  }
}

[data-theme="dark"] .warehouse-pallets-products span {
  color: #e5e7eb;
  background: rgba(148, 163, 184, 0.16);
  border-color: rgba(203, 213, 225, 0.24);
}

/* =====================================================
   Warehouse - pallets planificados editables en index
===================================================== */

.warehouse-pallet-plan-form {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 150px;
}

.warehouse-pallet-plan-input {
  width: 76px;
  min-width: 76px;
  text-align: right;
  font-weight: 800;
}

.warehouse-pallet-plan-form .btn {
  white-space: nowrap;
}

@media (max-width: 900px) {
  .warehouse-pallet-plan-form {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}


/* =====================================================
   Warehouse - Pallets visuales por producto
===================================================== */

.warehouse-pallet-visual {
  margin: 10px 0 12px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  background: rgba(148, 163, 184, 0.08);
}

.warehouse-pallet-visual__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 700;
}

.warehouse-pallet-visual__title strong {
  color: var(--text, #0f172a);
  font-size: 13px;
  white-space: nowrap;
}

.warehouse-pallet-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.warehouse-pallet-icon {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  font-size: 18px;
  line-height: 1;
}

.warehouse-pallet-visual--empty {
  color: var(--muted, #64748b);
  font-size: 13px;
  font-weight: 600;
}

[data-theme="dark"] .warehouse-pallet-visual {
  background: rgba(15, 23, 42, 0.36);
  border-color: rgba(203, 213, 225, 0.18);
}

[data-theme="dark"] .warehouse-pallet-visual__title {
  color: #cbd5e1;
}

[data-theme="dark"] .warehouse-pallet-visual__title strong {
  color: #ffffff;
}

[data-theme="dark"] .warehouse-pallet-icon {
  background: rgba(30, 41, 59, 0.88);
  border-color: rgba(203, 213, 225, 0.18);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
}

@media (max-width: 640px) {
  .warehouse-pallet-icon {
    width: 32px;
    height: 32px;
    font-size: 17px;
  }
}

/* =====================================================
   Packing Sheets - Detalle igual a pantalla Warehouse
===================================================== */

.warehouse-detail-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.warehouse-readonly-box {
  min-height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(255, 255, 255, .03);
  color: inherit;
  padding: 12px 14px;
  line-height: 1.45;
}

.warehouse-item-form--readonly {
  margin-top: 14px;
}

.warehouse-readonly-input {
  display: flex;
  align-items: center;
  min-height: 42px;
  width: 100%;
  box-sizing: border-box;
  color: inherit;
}


/* =====================================================
   Warehouse dashboard - igualar márgenes con Pickup dashboard
===================================================== */

.warehouse-body {
  background: #0b1220;
}

.warehouse-body .warehouse-tablet-page {
  width: 100%;
  max-width: none;
  min-height: 100vh;
  padding: 16px 18px 32px !important;
  box-sizing: border-box;
}

.warehouse-body .warehouse-tablet-page > .card {
  border-radius: 18px;
  margin-bottom: 16px;
}

.warehouse-body .warehouse-tablet-grid {
  padding: 0;
  margin-top: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.warehouse-body .warehouse-tablet-card {
  border-radius: 18px;
}

/* En pantallas pequeñas, una sola columna */
@media (max-width: 900px) {
  .warehouse-body .warehouse-tablet-page {
    padding: 12px 12px 24px !important;
  }

  .warehouse-body .warehouse-tablet-grid {
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   Warehouse tablet - selector modo claro / oscuro
===================================================== */

.warehouse-body {
  background: var(--bg) !important;
  color: var(--text);
  transition: background .18s ease, color .18s ease;
}

.warehouse-theme-tools {
  position: fixed;
  top: 12px;
  right: 14px;
  z-index: 40;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
}

.warehouse-theme-toggle {
  pointer-events: auto;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(8px);
}

.warehouse-body .warehouse-tablet-page {
  padding-top: 58px !important;
}

[data-theme="light"] .warehouse-tablet-meta > div,
[data-theme="light"] .warehouse-pallet-summary > div,
[data-theme="light"] .warehouse-separation-card,
[data-theme="light"] .warehouse-item-card {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .warehouse-pallet-visual {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
}

[data-theme="light"] .warehouse-pallet-icon {
  background: #ffffff !important;
  border-color: #dbe3ef !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
}

[data-theme="light"] .driver-kicker,
[data-theme="light"] .driver-subtitle,
[data-theme="light"] .warehouse-item-pallet-note,
[data-theme="light"] .warehouse-pallet-status,
[data-theme="light"] .warehouse-complete-help {
  color: #64748b !important;
}

[data-theme="dark"] .warehouse-theme-toggle {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(203, 213, 225, 0.26) !important;
  color: #e5e7eb !important;
}

[data-theme="light"] .warehouse-theme-toggle {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

@media (max-width: 640px) {
  .warehouse-theme-tools {
    top: 10px;
    right: 10px;
  }

  .warehouse-body .warehouse-tablet-page {
    padding-top: 54px !important;
  }

  .warehouse-theme-toggle {
    min-width: auto;
  }
}

/* =====================================================
   Pickup tablet - selector modo claro / oscuro
===================================================== */

.pickup-body {
  background: var(--bg) !important;
  color: var(--text);
  transition: background .18s ease, color .18s ease;
}

.pickup-theme-tools {
  position: fixed;
  top: 12px;
  right: 14px;
  z-index: 40;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
}

.pickup-theme-toggle {
  pointer-events: auto;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(8px);
}

.pickup-body .pickup-tablet-page {
  padding-top: 58px !important;
}

[data-theme="light"] .pickup-tablet-product,
[data-theme="light"] .pickup-evid-product,
[data-theme="light"] .evid-readonly,
[data-theme="light"] .evid-upload,
[data-theme="light"] .evid-sign-box,
[data-theme="light"] .evid-canvas-wrap {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .pickup-tablet-card__title,
[data-theme="light"] .driver-route-summary__title,
[data-theme="light"] .evid-label {
  color: #0f172a !important;
}

[data-theme="light"] .driver-kicker,
[data-theme="light"] .driver-subtitle,
[data-theme="light"] .driver-app__sub,
[data-theme="light"] .evid-help,
[data-theme="light"] .cell-sub {
  color: #64748b !important;
}

[data-theme="light"] .evid-input,
[data-theme="light"] .evid-textarea {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="dark"] .pickup-theme-toggle {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(203, 213, 225, 0.26) !important;
  color: #e5e7eb !important;
}

[data-theme="light"] .pickup-theme-toggle {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="dark"] .evid-input,
[data-theme="dark"] .evid-textarea {
  background: #111827 !important;
  border-color: rgba(203, 213, 225, 0.28) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .evid-readonly,
[data-theme="dark"] .evid-upload,
[data-theme="dark"] .evid-sign-box {
  background: rgba(15, 23, 42, 0.36) !important;
  border-color: rgba(203, 213, 225, 0.18) !important;
  color: #e5e7eb !important;
}

@media (max-width: 640px) {
  .pickup-theme-tools {
    top: 10px;
    right: 10px;
  }

  .pickup-body .pickup-tablet-page {
    padding-top: 54px !important;
  }

  .pickup-theme-toggle {
    min-width: auto;
  }
}

/* =====================================================
   Conductor tablet - selector modo claro / oscuro
===================================================== */

.driver-theme-body {
  background: var(--bg) !important;
  color: var(--text);
  transition: background .18s ease, color .18s ease;
}

.driver-theme-tools {
  position: fixed;
  top: 12px;
  right: 14px;
  z-index: 50;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
}

.driver-theme-toggle {
  pointer-events: auto;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(8px);
}

.driver-theme-body .driver-page {
  padding-top: 58px !important;
}

[data-theme="dark"] .driver-theme-toggle {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(203, 213, 225, 0.26) !important;
  color: #e5e7eb !important;
}

[data-theme="light"] .driver-theme-toggle {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* Modo claro - tarjetas y bloques del conductor */
[data-theme="light"] .driver-route-summary__meta > div,
[data-theme="light"] .driver-stop-card,
[data-theme="light"] .driver-stop-card__body,
[data-theme="light"] .driver-material-row,
[data-theme="light"] .driver-materials-summary,
[data-theme="light"] .driver-materials-item,
[data-theme="light"] .driver-stop-evidence-lock,
[data-theme="light"] .driver-stop-time-lock,
[data-theme="light"] .driver-materials-page .card,
[data-theme="light"] .driver-load-table-wrap,
[data-theme="light"] .evid-readonly,
[data-theme="light"] .evid-upload,
[data-theme="light"] .evid-sign-box,
[data-theme="light"] .evid-canvas-wrap {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .driver-title,
[data-theme="light"] .driver-route-summary__title,
[data-theme="light"] .driver-empty__title,
[data-theme="light"] .driver-stop-card__title,
[data-theme="light"] .driver-materials-summary__title,
[data-theme="light"] .evid-label {
  color: #0f172a !important;
}

[data-theme="light"] .driver-kicker,
[data-theme="light"] .driver-subtitle,
[data-theme="light"] .driver-empty__text,
[data-theme="light"] .driver-materials-help,
[data-theme="light"] .cell-sub,
[data-theme="light"] .evid-help {
  color: #64748b !important;
}

[data-theme="light"] .driver-map,
[data-theme="light"] .driver-route-map,
[data-theme="light"] #driverMap,
[data-theme="light"] #routeMap {
  background: #eef2f7 !important;
  border-color: #dbe3ef !important;
}

[data-theme="light"] .driver-material-row .input,
[data-theme="light"] .driver-load-qty,
[data-theme="light"] .driver-load-observation,
[data-theme="light"] .evid-input,
[data-theme="light"] .evid-textarea {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* Modo oscuro - ajustes puntuales */
[data-theme="dark"] .driver-material-row,
[data-theme="dark"] .driver-materials-summary,
[data-theme="dark"] .driver-stop-card,
[data-theme="dark"] .driver-stop-card__body,
[data-theme="dark"] .driver-stop-evidence-lock,
[data-theme="dark"] .driver-stop-time-lock,
[data-theme="dark"] .evid-readonly,
[data-theme="dark"] .evid-upload,
[data-theme="dark"] .evid-sign-box {
  background: rgba(15, 23, 42, 0.36) !important;
  border-color: rgba(203, 213, 225, 0.18) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .driver-load-qty,
[data-theme="dark"] .driver-load-observation,
[data-theme="dark"] .evid-input,
[data-theme="dark"] .evid-textarea {
  background: #111827 !important;
  border-color: rgba(203, 213, 225, 0.28) !important;
  color: #ffffff !important;
}

@media (max-width: 640px) {
  .driver-theme-tools {
    top: 10px;
    right: 10px;
  }

  .driver-theme-body .driver-page {
    padding-top: 54px !important;
  }

  .driver-theme-toggle {
    min-width: auto;
  }
}

/* =====================================================
   Operations tablet - theme button dentro de tarjeta
   Warehouse + Pickup
===================================================== */

.warehouse-theme-tools,
.pickup-theme-tools {
  display: none !important;
}

/* El botón ya vive dentro de la tarjeta inicial */
.warehouse-theme-toggle,
.pickup-theme-toggle {
  box-shadow: none !important;
  backdrop-filter: none !important;
  white-space: nowrap;
}

/* Quitar espacio extra que se había agregado por el botón flotante */
.warehouse-body .warehouse-tablet-page {
  padding-top: 16px !important;
}

.pickup-body .pickup-tablet-page {
  padding-top: 16px !important;
}

/* En tablet pequeña conservar los márgenes compactos */
@media (max-width: 900px) {
  .warehouse-body .warehouse-tablet-page {
    padding-top: 12px !important;
  }
}

@media (max-width: 640px) {
  .pickup-body .pickup-tablet-page {
    padding-top: 10px !important;
  }

  .warehouse-theme-toggle,
  .pickup-theme-toggle {
    min-width: auto;
  }
}

/* =====================================================
   Conductor tablet - selector modo claro / oscuro
   Conductor + Materiales
===================================================== */

.driver-theme-body {
  background: var(--bg) !important;
  color: var(--text);
  transition: background .18s ease, color .18s ease;
}

.driver-theme-toggle {
  box-shadow: none !important;
  backdrop-filter: none !important;
  white-space: nowrap;
}

[data-theme="dark"] .driver-theme-toggle {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(203, 213, 225, 0.26) !important;
  color: #e5e7eb !important;
}

[data-theme="light"] .driver-theme-toggle {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* Modo claro - tarjetas y bloques del conductor */
[data-theme="light"] .driver-route-summary__meta > div,
[data-theme="light"] .driver-stop-card,
[data-theme="light"] .driver-stop-card__body,
[data-theme="light"] .driver-material-row,
[data-theme="light"] .driver-materials-summary,
[data-theme="light"] .driver-materials-item,
[data-theme="light"] .driver-stop-evidence-lock,
[data-theme="light"] .driver-stop-time-lock,
[data-theme="light"] .driver-materials-page .card,
[data-theme="light"] .driver-load-card,
[data-theme="light"] .driver-load-table-wrap,
[data-theme="light"] .evid-readonly,
[data-theme="light"] .evid-upload,
[data-theme="light"] .evid-sign-box,
[data-theme="light"] .evid-canvas-wrap {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .driver-title,
[data-theme="light"] .driver-route-summary__title,
[data-theme="light"] .driver-empty__title,
[data-theme="light"] .driver-stop-card__title,
[data-theme="light"] .driver-materials-summary__title,
[data-theme="light"] .evid-label {
  color: #0f172a !important;
}

[data-theme="light"] .driver-kicker,
[data-theme="light"] .driver-subtitle,
[data-theme="light"] .driver-empty__text,
[data-theme="light"] .driver-app__sub,
[data-theme="light"] .driver-materials-help,
[data-theme="light"] .cell-sub,
[data-theme="light"] .evid-help {
  color: #64748b !important;
}

[data-theme="light"] .driver-map,
[data-theme="light"] .driver-route-map,
[data-theme="light"] #driverMap,
[data-theme="light"] #routeMap {
  background: #eef2f7 !important;
  border-color: #dbe3ef !important;
}

[data-theme="light"] .driver-material-row .input,
[data-theme="light"] .driver-load-qty,
[data-theme="light"] .driver-load-observation,
[data-theme="light"] .evid-input,
[data-theme="light"] .evid-textarea {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* Modo oscuro - ajustes puntuales */
[data-theme="dark"] .driver-material-row,
[data-theme="dark"] .driver-materials-summary,
[data-theme="dark"] .driver-stop-card,
[data-theme="dark"] .driver-stop-card__body,
[data-theme="dark"] .driver-stop-evidence-lock,
[data-theme="dark"] .driver-stop-time-lock,
[data-theme="dark"] .evid-readonly,
[data-theme="dark"] .evid-upload,
[data-theme="dark"] .evid-sign-box {
  background: rgba(15, 23, 42, 0.36) !important;
  border-color: rgba(203, 213, 225, 0.18) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .driver-load-qty,
[data-theme="dark"] .driver-load-observation,
[data-theme="dark"] .evid-input,
[data-theme="dark"] .evid-textarea {
  background: #111827 !important;
  border-color: rgba(203, 213, 225, 0.28) !important;
  color: #ffffff !important;
}

@media (max-width: 640px) {
  .driver-theme-toggle {
    min-width: auto;
  }
}

/* =====================================================
   Conductor tablet - quitar espacio de botón flotante
===================================================== */

.driver-theme-tools {
  display: none !important;
}

.driver-theme-body .driver-page {
  padding-top: 16px !important;
}

@media (max-width: 640px) {
  .driver-theme-body .driver-page {
    padding-top: 10px !important;
  }
}

/* =====================================================
   Dashboard conductores - contraste métricas destacado
===================================================== */

[data-theme="dark"] .driver-champion__metrics div {
  background: rgba(15, 23, 42, 0.52) !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .driver-champion__metrics strong {
  color: #f8fafc !important;
}

[data-theme="dark"] .driver-champion__metrics span {
  color: #94a3b8 !important;
}

[data-theme="light"] .driver-champion__metrics div {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .driver-champion__metrics strong {
  color: #0f172a !important;
}

[data-theme="light"] .driver-champion__metrics span {
  color: #64748b !important;
}

/* =====================================================
   Dashboard conductores - contraste en modo oscuro
===================================================== */

/* Métricas internas del conductor destacado */
[data-theme="dark"] .driver-champion__metrics div {
  background: rgba(15, 23, 42, 0.52) !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .driver-champion__metrics strong {
  color: #f8fafc !important;
}

[data-theme="dark"] .driver-champion__metrics span {
  color: #94a3b8 !important;
}

/* Mantener limpio en modo claro */
[data-theme="light"] .driver-champion__metrics div {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="light"] .driver-champion__metrics strong {
  color: #0f172a !important;
}

[data-theme="light"] .driver-champion__metrics span {
  color: #64748b !important;
}

/* Usuario en topbar - más legible */
[data-theme="dark"] .topbar__user,
[data-theme="dark"] .topbar__username,
[data-theme="dark"] .topbar-user,
[data-theme="dark"] .app-user-name {
  color: #cbd5e1 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

[data-theme="light"] .topbar__user,
[data-theme="light"] .topbar__username,
[data-theme="light"] .topbar-user,
[data-theme="light"] .app-user-name {
  color: #334155 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

/* =====================================================
   Dashboard tabs - corrección modo oscuro app principal
===================================================== */

html[data-theme="dark"] .dash-tabs .dash-tab,
body[data-theme="dark"] .dash-tabs .dash-tab,
html[data-theme="dark"] .dashboard-tabs .dash-tab,
body[data-theme="dark"] .dashboard-tabs .dash-tab,
html[data-theme="dark"] .dash-tab,
body[data-theme="dark"] .dash-tab {
  background: #111827 !important;
  border: 1px solid rgba(148, 163, 184, 0.38) !important;
  color: #e5e7eb !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .dash-tabs .dash-tab:hover,
body[data-theme="dark"] .dash-tabs .dash-tab:hover,
html[data-theme="dark"] .dashboard-tabs .dash-tab:hover,
body[data-theme="dark"] .dashboard-tabs .dash-tab:hover,
html[data-theme="dark"] .dash-tab:hover,
body[data-theme="dark"] .dash-tab:hover {
  background: #1e293b !important;
  border-color: rgba(203, 213, 225, 0.52) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .dash-tabs .dash-tab.is-active,
body[data-theme="dark"] .dash-tabs .dash-tab.is-active,
html[data-theme="dark"] .dashboard-tabs .dash-tab.is-active,
body[data-theme="dark"] .dashboard-tabs .dash-tab.is-active,
html[data-theme="dark"] .dash-tab.is-active,
body[data-theme="dark"] .dash-tab.is-active {
  background: #3b82f6 !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}


/* =====================================================
   Packing Sheets - generación por lote
===================================================== */

.packing-generate-card {
  margin: 16px 0;
}

.packing-generate-card .card__bd {
  overflow-x: auto;
}

.packing-generate-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.packing-generate-selectall {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 800;
  color: var(--text);
}

.packing-generate-table th:first-child,
.packing-generate-table td:first-child {
  width: 48px;
  text-align: center;
}

.packing-generate-table td {
  vertical-align: middle;
}