:root{
  --corp-bg:#f4f6f8;
  --corp-panel:#ffffff;
  --corp-panel-soft:#f8fafc;
  --corp-line:#d7dee7;
  --corp-line-soft:#e7edf3;
  --corp-text:#17212f;
  --corp-muted:#5d6b7c;
  --corp-primary:#153b63;
  --corp-primary-2:#0f2f50;
  --corp-primary-soft:#eef4fa;
  --corp-green:#16834a;
  --corp-red:#b42318;
  --corp-orange:#b76b00;
  --corp-radius:10px;
  --corp-shadow:0 1px 2px rgba(16,24,40,.06);
}

html,
body{
  background:var(--corp-bg) !important;
  color:var(--corp-text) !important;
  font-family:Inter, Arial, Helvetica, sans-serif !important;
}

.app{
  background:var(--corp-bg) !important;
}

.main{
  background:var(--corp-bg) !important;
}

.topbar{
  background:var(--corp-panel) !important;
  border:1px solid var(--corp-line-soft) !important;
  border-radius:14px !important;
  margin:12px 14px 0 !important;
  box-shadow:var(--corp-shadow) !important;
}

.topbar h2{
  color:var(--corp-text) !important;
  font-size:20px !important;
  letter-spacing:-.02em !important;
}

.topbar p{
  color:var(--corp-muted) !important;
  font-size:12px !important;
}

.view-container{
  padding:12px 14px 18px !important;
}

.sidebar{
  background:#0f1724 !important;
  border-right:1px solid rgba(255,255,255,.08) !important;
}

.brand h1{
  letter-spacing:.04em !important;
  font-size:14px !important;
}

.brand p,
.menu-label{
  color:rgba(255,255,255,.56) !important;
}

.menu-btn{
  border-radius:9px !important;
  color:rgba(255,255,255,.78) !important;
  background:transparent !important;
  border:1px solid transparent !important;
  font-weight:800 !important;
}

.menu-btn:hover{
  background:rgba(255,255,255,.07) !important;
  color:#fff !important;
}

.menu-btn.active{
  background:#ffffff !important;
  color:#111827 !important;
  border-color:#ffffff !important;
  box-shadow:none !important;
}

button,
.btn,
.dash-btn,
.rm7-btn,
.dash-quick-btn{
  border-radius:9px !important;
  box-shadow:none !important;
  font-weight:850 !important;
}

button:not(.menu-btn):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out),
.btn,
.dash-btn,
.rm7-btn{
  border-color:var(--corp-line) !important;
}

.dash-btn-primary,
.rm7-btn:not(.secondary),
.btn.primary,
button.primary{
  background:var(--corp-primary) !important;
  border-color:var(--corp-primary) !important;
  color:#fff !important;
}

.dash-btn-soft,
.rm7-btn.secondary,
.btn.soft,
button.soft{
  background:#fff !important;
  color:var(--corp-primary) !important;
  border-color:var(--corp-line) !important;
}

.dash-shell,
.toa-card,
.rm7-card,
.rm7-panel,
.dispatch-card,
.card,
.panel,
.fotos-card,
.inv-card{
  background:var(--corp-panel) !important;
  border:1px solid var(--corp-line) !important;
  border-radius:var(--corp-radius) !important;
  box-shadow:var(--corp-shadow) !important;
}

.dash-head,
.rm7-head,
.toa-card-head,
.rm7-panel-head{
  background:#fff !important;
  border-color:var(--corp-line-soft) !important;
}

.rm7-head{
  box-shadow:none !important;
}

.rm7-head h2,
.dash-head h3,
.rm7-panel-head h3,
.toa-card-head h4{
  color:var(--corp-text) !important;
  letter-spacing:-.02em !important;
}

.rm7-head p,
.dash-head p,
.rm7-panel-head p,
.toa-card-head p{
  color:var(--corp-muted) !important;
}

.rm7-tabs{
  background:#fff !important;
  border-bottom:1px solid var(--corp-line-soft) !important;
}

.rm7-tab{
  background:#fff !important;
  color:var(--corp-muted) !important;
  border:0 !important;
  border-bottom:3px solid transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:11px 12px !important;
}

.rm7-tab.active{
  background:#fff !important;
  color:var(--corp-primary) !important;
  border-bottom-color:var(--corp-primary) !important;
  box-shadow:none !important;
}

.rm7-kpis,
.dash-counters{
  gap:10px !important;
}

.rm7-kpi,
.dash-counter{
  border:1px solid var(--corp-line-soft) !important;
  border-left:4px solid var(--corp-primary) !important;
  border-radius:10px !important;
  min-height:78px !important;
  box-shadow:var(--corp-shadow) !important;
  background:#fff !important;
}

.rm7-kpi strong,
.dash-counter b{
  color:var(--corp-text) !important;
  font-size:26px !important;
}

.rm7-kpi span,
.dash-counter span{
  color:#4b5f75 !important;
  font-size:10px !important;
  letter-spacing:.04em !important;
}

.rm7-kpi small,
.dash-counter small{
  color:var(--corp-muted) !important;
}

.rm7-kpi.green,
.dash-counter.is-done{
  border-left-color:var(--corp-green) !important;
}

.rm7-kpi.red,
.dash-counter.is-failed{
  border-left-color:var(--corp-red) !important;
}

.rm7-kpi.orange,
.dash-counter.is-pending,
.dash-counter.is-progress{
  border-left-color:var(--corp-orange) !important;
}

table{
  border-color:var(--corp-line-soft) !important;
}

.rm7-table,
table{
  border-radius:8px !important;
}

.rm7-table th,
table th{
  background:#f8fafc !important;
  color:#475569 !important;
  font-weight:850 !important;
  letter-spacing:.03em !important;
}

.rm7-table td,
table td{
  color:var(--corp-text) !important;
}

input,
select,
textarea,
.rm7-input,
.rm7-select{
  border-radius:8px !important;
  border-color:var(--corp-line) !important;
  background:#fff !important;
  color:var(--corp-text) !important;
  box-shadow:none !important;
}

input:focus,
select:focus,
textarea:focus{
  outline:2px solid rgba(21,59,99,.18) !important;
  border-color:var(--corp-primary) !important;
}

.rm7-badge{
  background:var(--corp-primary-soft) !important;
  border:1px solid var(--corp-line) !important;
  color:var(--corp-primary) !important;
  border-radius:999px !important;
}

.rm7-note{
  background:#fff !important;
  border:1px solid var(--corp-line-soft) !important;
  color:var(--corp-muted) !important;
}

.toa-green-bar{
  background:#e7edf3 !important;
  border-color:var(--corp-line) !important;
  height:6px !important;
}

.toa-header,
.toa-left-head{
  background:#f8fafc !important;
}

.toa-hour{
  color:#475569 !important;
}

.toa-row-left strong{
  color:var(--corp-text) !important;
}

.toa-event{
  border-color:#326b9c !important;
  background:#d8e8f6 !important;
  color:#143653 !important;
  box-shadow:none !important;
}

.toa-event.is-fallida{
  border-color:#cc8a25 !important;
  background:#fff1d6 !important;
  color:#704600 !important;
  box-shadow:none !important;
}

svg text{
  font-family:Inter, Arial, Helvetica, sans-serif !important;
}

@media(max-width:900px){
  .topbar{
    margin:8px !important;
  }

  .view-container{
    padding:8px !important;
  }
}

:root{
  --corp-bg:#f3f5f7;
  --corp-panel:#ffffff;
  --corp-line:#d9e0e8;
  --corp-line-soft:#edf1f5;
  --corp-text:#17202b;
  --corp-muted:#667085;
  --corp-primary:#17395c;
  --corp-primary-soft:#f1f5f9;
  --corp-green:#157347;
  --corp-red:#b42318;
  --corp-orange:#a15c07;
  --corp-shadow:0 1px 2px rgba(16,24,40,.05);
}

.topbar{
  min-height:58px !important;
  padding:12px 16px !important;
  border-radius:10px !important;
}

.topbar h2{
  font-size:19px !important;
  font-weight:850 !important;
}

.topbar p{
  font-size:12px !important;
  font-weight:650 !important;
}

.mo-head,
.mo-header,
.mo-top,
.mo-hero,
[class*="mo-"][class*="head"]{
  background:#fff !important;
  border:1px solid var(--corp-line) !important;
  border-radius:10px !important;
  box-shadow:var(--corp-shadow) !important;
}

.mo-title{
  font-size:22px !important;
  line-height:1.15 !important;
  font-weight:850 !important;
  letter-spacing:-.025em !important;
  color:var(--corp-text) !important;
}

.mo-title + p,
.mo-subtitle,
.mo-description,
.mo-head p,
.mo-header p{
  color:var(--corp-muted) !important;
  font-size:12px !important;
  font-weight:650 !important;
}

.mo-kicker,
.mo-badge,
.mo-pill,
[class*="mo-"][class*="badge"],
[class*="mo-"][class*="kicker"]{
  background:transparent !important;
  border:0 !important;
  color:var(--corp-muted) !important;
  padding:0 !important;
  font-size:10px !important;
  letter-spacing:.08em !important;
  font-weight:800 !important;
}

.mo-toolbar,
.mo-filters,
.mo-controls,
[class*="mo-"][class*="toolbar"],
[class*="mo-"][class*="controls"]{
  gap:8px !important;
  align-items:end !important;
}

.mo-toolbar label,
.mo-filters label,
.mo-controls label,
[class*="mo-"] label{
  color:#475467 !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.04em !important;
}

.mo-toolbar input,
.mo-toolbar select,
.mo-filters input,
.mo-filters select,
.mo-controls input,
.mo-controls select{
  min-height:34px !important;
  border-radius:7px !important;
  border-color:var(--corp-line) !important;
  font-size:12px !important;
  font-weight:700 !important;
}

.mo-toolbar button,
.mo-filters button,
.mo-controls button,
[class*="mo-"] button{
  min-height:34px !important;
  border-radius:7px !important;
  font-size:12px !important;
  font-weight:800 !important;
  box-shadow:none !important;
}

.mo-kpis,
.mo-stats,
.mo-cards,
[class*="mo-"][class*="kpi"],
[class*="mo-"][class*="stats"]{
  gap:10px !important;
}

.mo-stat,
.mo-kpi,
.mo-card-stat,
[class*="mo-"][class*="stat"]{
  min-height:72px !important;
  border-radius:9px !important;
  border:1px solid var(--corp-line) !important;
  border-left:4px solid var(--corp-primary) !important;
  box-shadow:var(--corp-shadow) !important;
  background:#fff !important;
  padding:11px 12px !important;
}

.mo-stat b,
.mo-stat strong,
.mo-kpi b,
.mo-kpi strong,
.mo-card-stat b,
.mo-card-stat strong,
[class*="mo-"][class*="stat"] b,
[class*="mo-"][class*="stat"] strong{
  font-size:25px !important;
  line-height:1 !important;
  color:var(--corp-text) !important;
  font-weight:850 !important;
}

.mo-stat span,
.mo-kpi span,
.mo-card-stat span,
[class*="mo-"][class*="stat"] span{
  color:#526174 !important;
  font-size:10px !important;
  font-weight:850 !important;
  letter-spacing:.06em !important;
}

.mo-stat small,
.mo-kpi small,
.mo-card-stat small,
[class*="mo-"][class*="stat"] small{
  color:var(--corp-muted) !important;
  font-size:10px !important;
  font-weight:650 !important;
}

.mo-progress,
.mo-progress-bar,
[class*="progress"]{
  height:5px !important;
  border-radius:999px !important;
  box-shadow:none !important;
}

.mo-progress > *,
.mo-progress-bar > *,
[class*="progress"] > *{
  box-shadow:none !important;
}

.mo-panel,
.mo-map-card,
.mo-detail,
.mo-side,
.mo-sidebar,
.mo-detail-panel,
[class*="mo-"][class*="panel"],
[class*="mo-"][class*="detail"],
[class*="mo-"][class*="side"]{
  border-radius:10px !important;
  border:1px solid var(--corp-line) !important;
  box-shadow:var(--corp-shadow) !important;
  background:#fff !important;
}

#map,
#mapa,
.leaflet-container{
  border-radius:8px !important;
  background:#eef2f6 !important;
}

.leaflet-popup-content-wrapper{
  border-radius:8px !important;
  box-shadow:0 8px 20px rgba(16,24,40,.16) !important;
}

.leaflet-popup-content{
  font-size:12px !important;
  color:var(--corp-text) !important;
}

.leaflet-control-zoom a{
  color:#1f2937 !important;
  box-shadow:none !important;
}

.mo-detail h3,
.mo-detail-panel h3,
.mo-side h3,
.mo-sidebar h3,
[class*="mo-"][class*="detail"] h3{
  font-size:14px !important;
  font-weight:850 !important;
  color:var(--corp-text) !important;
}

.mo-detail p,
.mo-detail-panel p,
.mo-side p,
.mo-sidebar p,
[class*="mo-"][class*="detail"] p{
  font-size:11px !important;
  color:var(--corp-muted) !important;
}

.mo-detail .card,
.mo-detail-panel .card,
.mo-side .card,
.mo-sidebar .card,
[class*="mo-"][class*="detail"] .card{
  border-radius:8px !important;
  border:1px solid var(--corp-line-soft) !important;
  background:#fff !important;
  box-shadow:none !important;
}

.badge,
.chip,
.status,
.mo-chip,
.mo-status,
[class*="badge"],
[class*="chip"],
[class*="status"]{
  border-radius:999px !important;
  font-size:10px !important;
  font-weight:850 !important;
  box-shadow:none !important;
}

.mo-panel-head,
.mo-card-head,
[class*="mo-"][class*="head"]{
  border-bottom-color:var(--corp-line-soft) !important;
}

.mo-detail table,
.mo-side table,
.mo-sidebar table,
[class*="mo-"][class*="detail"] table{
  font-size:11px !important;
}

.mo-detail li,
.mo-side li,
.mo-sidebar li,
[class*="mo-"][class*="detail"] li{
  font-size:11px !important;
}

[style*="#eaf"],
[style*="#eef"],
[style*="#f2f8"],
[style*="#f4f9"]{
  box-shadow:none !important;
}

.ruta-evento-v1-bar.is-finalizado{
  background:#16a34a !important;
  border-top-color:#15803d !important;
}

.ruta-evento-v1-bar.is-curso{
  background:#f59e0b !important;
  border-top-color:#d97706 !important;
}

.ruta-evento-v1-bar{
  height: 24px !important;
  min-width: 150px !important;
  border-radius: 6px !important;
  border: 1px solid #0f5f99 !important;
  border-left: 5px solid #0b4a78 !important;
  background: linear-gradient(180deg, #dff6ff 0%, #bdeeff 100%) !important;
  color: #0f2742 !important;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .18) !important;
  padding: 2px 8px 2px 7px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 0 !important;
  line-height: 1.05 !important;
  overflow: hidden !important;
  text-align: left !important;
}

.ruta-evento-v1-bar .rev16-main,
.ruta-evento-v1-bar span:first-child{
  display: block !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  color: #09243b !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}

.ruta-evento-v1-bar .rev16-meta,
.ruta-evento-v1-bar small{
  display: block !important;
  margin: 1px 0 0 0 !important;
  font-size: 8.5px !important;
  font-weight: 800 !important;
  color: #31546f !important;
  opacity: .95 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.ruta-evento-v1-bar.is-finalizado{
  background: linear-gradient(180deg, #dcfce7 0%, #bbf7d0 100%) !important;
  border-color: #16a34a !important;
  border-left-color: #15803d !important;
  color: #052e16 !important;
}

.ruta-evento-v1-bar.is-finalizado .rev16-main,
.ruta-evento-v1-bar.is-finalizado span:first-child{
  color: #052e16 !important;
}

.ruta-evento-v1-bar.is-curso{
  background: linear-gradient(180deg, #fef3c7 0%, #fde68a 100%) !important;
  border-color: #d97706 !important;
  border-left-color: #b45309 !important;
  color: #3b1d00 !important;
}

.ruta-evento-v1-bar.is-sin-horario{
  background: linear-gradient(180deg, #e0f2fe 0%, #bae6fd 100%) !important;
  border-color: #0284c7 !important;
  border-left-color: #0369a1 !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada{
  position:absolute !important;
  height:14px !important;
  min-width:58px !important;
  border-radius:4px !important;
  border:0 !important;
  border-top:3px solid #0f5b93 !important;
  background:#0ea5e9 !important;
  color:#ffffff !important;
  box-shadow:0 1px 3px rgba(15,23,42,.22) !important;
  padding:0 4px !important;
  display:block !important;
  line-height:10px !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-align:left !important;
  z-index:28 !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada span{
  display:inline-block !important;
  max-width:calc(100% - 35px) !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  vertical-align:middle !important;
  font-size:8px !important;
  font-weight:950 !important;
  color:#ffffff !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada small{
  float:right !important;
  margin:0 !important;
  font-size:8px !important;
  font-weight:950 !important;
  color:#ffffff !important;
  opacity:.95 !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada.is-finalizado{
  background:#16a34a !important;
  border-top-color:#15803d !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada.is-curso{
  background:#f59e0b !important;
  border-top-color:#b45309 !important;
  color:#3b1d00 !important;
}

.toa-row-lane .ruta-evento-v1-bar.is-en-jornada.is-curso span,
.toa-row-lane .ruta-evento-v1-bar.is-en-jornada.is-curso small{
  color:#3b1d00 !important;
}

/* TRAZZA_RUTA_DIARIA_PULIDO_20260720
   La jornada deja de dominar visualmente la línea de tiempo.
   La barra importante pasa a ser la ODT real: en curso / finalizada / fallida.
*/
.dash-toa-v10 .toa-jornada{
  background:rgba(203,244,248,.10)!important;
  border:1px dashed rgba(56,189,248,.32)!important;
  box-shadow:none!important;
  pointer-events:none!important;
  opacity:.42!important;
}

.dash-toa-v10 .toa-jornada:before,
.dash-toa-v10 .toa-jornada:after{
  display:none!important;
}

.dash-toa-v10 .toa-jornada-head{
  display:none!important;
}

.dash-toa-v10 .toa-event{
  z-index:42!important;
  min-width:42px!important;
  height:24px!important;
  line-height:21px!important;
  font-size:11px!important;
  font-weight:900!important;
  border-radius:4px!important;
}

.dash-toa-v10 .toa-event.is-finalizado{
  background:#bbf7d0!important;
  border-color:#16a34a!important;
  color:#064e3b!important;
  box-shadow:inset 0 -4px 0 #16a34a!important;
}

.dash-toa-v10 .toa-event:not(.is-finalizado):not(.is-fallida){
  background:#bfdbfe!important;
  border-color:#2563eb!important;
  color:#0f172a!important;
  box-shadow:inset 0 -4px 0 #2563eb!important;
}

/* TRAZZA_RUTA_DIARIA_JORNADA_MINIMA_20260720
   La jornada queda como referencia mínima.
   La operación visible principal son las ODT.
*/
.dash-toa-v10 .toa-jornada{
  height:5px!important;
  min-height:5px!important;
  max-height:5px!important;
  top:3px!important;
  opacity:.28!important;
  background:#67e8f9!important;
  border:0!important;
  border-radius:999px!important;
  box-shadow:none!important;
  pointer-events:none!important;
  z-index:1!important;
}

.dash-toa-v10 .toa-jornada.is-open{
  background:#bae6fd!important;
  opacity:.22!important;
}

.dash-toa-v10 .toa-jornada-head{
  display:none!important;
}

.dash-toa-v10 .toa-event{
  z-index:20!important;
  top:12px!important;
  height:24px!important;
  min-height:24px!important;
  line-height:22px!important;
  font-size:11px!important;
  font-weight:900!important;
  border-radius:4px!important;
}

.dash-toa-v10 .toa-event.is-finalizado{
  background:#bbf7d0!important;
  border-color:#16a34a!important;
  color:#064e3b!important;
}

.dash-toa-v10 .toa-event:not(.is-finalizado):not(.is-fallida){
  background:#bfdbfe!important;
  border-color:#2563eb!important;
  color:#0f172a!important;
}


/* La banda de jornada nunca debe tapar una ODT. */
#dashboardOperativo .dash-toa-v10 .toa-row-lane .toa-jornada{
  z-index:5!important;
}

#dashboardOperativo .dash-toa-v10 .toa-row-lane .toa-event,
#dashboardOperativo .dash-toa-v10 .toa-row-lane .ruta-evento-v1-bar{
  z-index:20!important;
}

/* TRAZZA_RUTA_DIARIA_JORNADA_COMPACTA_SELECTOR_REAL_20260723
   dashboardOperativo y dash-toa-v10 son el mismo elemento.
*/
#dashboardOperativo.dash-toa-v10 .toa-row{
  min-height:44px!important;
}

#dashboardOperativo.dash-toa-v10 .toa-row-lane{
  position:relative!important;
  min-height:40px!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada{
  position:absolute!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;

  top:4px!important;
  height:30px!important;
  min-height:30px!important;
  max-height:30px!important;

  overflow:hidden!important;
  pointer-events:none!important;

  background:rgba(207,250,254,.62)!important;
  border:1px solid rgba(8,145,178,.52)!important;
  border-bottom:3px solid #0891b2!important;
  border-radius:5px!important;

  box-shadow:none!important;
  z-index:4!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada.is-open{
  background:rgba(186,230,253,.62)!important;
  border-color:rgba(2,132,199,.58)!important;
  border-bottom-color:#0284c7!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada::before,
#dashboardOperativo.dash-toa-v10 .toa-jornada::after{
  display:none!important;
  content:none!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada-head{
  position:absolute!important;
  top:1px!important;
  left:5px!important;
  right:5px!important;

  display:flex!important;
  visibility:visible!important;
  opacity:1!important;

  height:11px!important;
  min-height:11px!important;

  align-items:center!important;
  justify-content:space-between!important;
  gap:6px!important;

  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;

  color:#155e75!important;
  font-size:8px!important;
  line-height:10px!important;
  font-weight:900!important;

  overflow:hidden!important;
  white-space:nowrap!important;
  pointer-events:none!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada-head span{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;

  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

#dashboardOperativo.dash-toa-v10 .toa-event{
  position:absolute!important;
  top:17px!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;

  z-index:20!important;

  border-width:1px!important;
  border-style:solid!important;
  border-radius:4px!important;

  padding:0 4px!important;
  font-size:8px!important;
  line-height:16px!important;
  font-weight:900!important;

  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;

  box-shadow:0 1px 3px rgba(15,23,42,.22)!important;
}

#dashboardOperativo.dash-toa-v10 .toa-event.is-finalizado{
  background:linear-gradient(180deg,#dcfce7,#86efac)!important;
  border-color:#15803d!important;
  border-bottom:3px solid #15803d!important;
  color:#052e16!important;
}

#dashboardOperativo.dash-toa-v10
.toa-event:not(.is-finalizado):not(.is-fallida){
  background:linear-gradient(180deg,#dbeafe,#93c5fd)!important;
  border-color:#1d4ed8!important;
  border-bottom:3px solid #1d4ed8!important;
  color:#172554!important;
}

#dashboardOperativo.dash-toa-v10 .toa-event.is-fallida{
  background:linear-gradient(180deg,#fef3c7,#fde68a)!important;
  border-color:#d97706!important;
  border-bottom:3px solid #d97706!important;
  color:#78350f!important;
}

#dashboardOperativo.dash-toa-v10 .ruta-evento-v1-bar{
  z-index:22!important;
}

/* ==========================================================
   TRAZZA_ESTADO_VISUAL_JORNADA_20260724

   La clase is-open ya es aplicada por la lógica existente:
   - .toa-jornada.is-open = jornada todavía abierta
   - .toa-jornada         = jornada cerrada

   No altera los colores ni la posición de las ODT.
   ========================================================== */

/* Jornada cerrada: gris claro. */
#dashboardOperativo.dash-toa-v10 .toa-jornada:not(.is-open){
  background:rgba(226,232,240,.88)!important;
  border-color:rgba(100,116,139,.62)!important;
  border-bottom-color:#64748b!important;
  color:#334155!important;
}

/*
 * Marca de cierre limitada a la altura de la propia jornada.
 * No atraviesa otras cuadrillas ni se confunde con la hora actual.
 */
#dashboardOperativo.dash-toa-v10 .toa-jornada:not(.is-open)::after{
  content:""!important;
  display:block!important;

  position:absolute!important;
  top:-1px!important;
  right:-1px!important;
  bottom:-1px!important;
  left:auto!important;

  width:2px!important;
  height:auto!important;

  background:#dc2626!important;
  border:0!important;
  border-radius:0 4px 4px 0!important;

  opacity:1!important;
  pointer-events:none!important;
  z-index:8!important;
}

/* Jornada abierta: conserva el celeste actual y no muestra línea roja. */
#dashboardOperativo.dash-toa-v10 .toa-jornada.is-open{
  background:rgba(186,230,253,.62)!important;
  border-color:rgba(2,132,199,.58)!important;
  border-bottom-color:#0284c7!important;
}

#dashboardOperativo.dash-toa-v10 .toa-jornada.is-open::after{
  content:none!important;
  display:none!important;
}

/* El encabezado de jornada queda por encima de la marca de cierre. */
#dashboardOperativo.dash-toa-v10
.toa-jornada:not(.is-open)
.toa-jornada-head{
  position:absolute!important;
  z-index:9!important;
  color:#334155!important;
}

/* Las ODT permanecen por encima de la banda. */
#dashboardOperativo.dash-toa-v10 .toa-event,
#dashboardOperativo.dash-toa-v10 .ruta-evento-render{
  z-index:20!important;
}


/* TRAZZA_INDICADORES_RUTA_DIARIA_CSS_V1 */

#kpiPanelWrap,
[data-kpi-old-hidden="1"] {
  display: none !important;
}

.trazza-ruta-indicadores {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 8px 0 10px !important;
  padding: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.trazza-ruta-indicadores .trazza-indicador {
  min-width: 0 !important;
  min-height: 68px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  column-gap: 12px !important;
  align-items: center !important;
  padding: 10px 13px !important;
  border: 1px solid #cbd8e6 !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  box-shadow:
    0 2px 7px rgba(15, 23, 42, 0.06),
    0 1px 2px rgba(15, 23, 42, 0.04) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

.trazza-ruta-indicadores .trazza-indicador span {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: block !important;
  min-width: 0 !important;
  font-size: 10px !important;
  line-height: 1.18 !important;
  font-weight: 900 !important;
  letter-spacing: 0.035em !important;
  color: #334155 !important;
  white-space: normal !important;
}

.trazza-ruta-indicadores .trazza-indicador b {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
  display: block !important;
  min-width: 42px !important;
  font-size: 28px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-align: right !important;
  color: #123f69 !important;
}

.trazza-ruta-indicadores .trazza-indicador small {
  grid-column: 1 !important;
  grid-row: 2 !important;
  display: block !important;
  margin-top: 3px !important;
  min-width: 0 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  font-weight: 750 !important;
  color: #64748b !important;
  white-space: normal !important;
}

.trazza-ruta-indicadores .is-crews {
  border-left: 5px solid #2563eb !important;
  background: #eff6ff !important;
}

.trazza-ruta-indicadores .is-done {
  border-left: 5px solid #16a34a !important;
  background: #f0fdf4 !important;
}

.trazza-ruta-indicadores .is-failed {
  border-left: 5px solid #ea580c !important;
  background: #fff7ed !important;
}

.trazza-ruta-indicadores .is-pending {
  border-left: 5px solid #ca8a04 !important;
  background: #fefce8 !important;
}

@media (max-width: 1050px) {
  .trazza-ruta-indicadores {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  .trazza-ruta-indicadores {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  .trazza-ruta-indicadores .trazza-indicador {
    min-height: 60px !important;
  }
}


/* TRAZZA_INDICADORES_CABECERA_CSS_V2 */

.main > .topbar.trazza-cabecera-con-indicadores,
.main .topbar.trazza-cabecera-con-indicadores,
.topbar.trazza-cabecera-con-indicadores {
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  min-height: 78px !important;
  height: 78px !important;
  padding: 8px 12px !important;
  overflow: visible !important;
  background: #f5f7fa !important;
  box-sizing: border-box !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;

  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;

  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: visible !important;
  position: relative !important;
  z-index: 20 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.trazza-indicador {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;

  min-width: 0 !important;
  min-height: 0 !important;
  height: 62px !important;

  padding: 8px 12px !important;

  border-radius: 11px !important;
  border: 1px solid #cbd8e6 !important;

  box-shadow:
    0 2px 6px rgba(15, 23, 42, 0.06),
    0 1px 2px rgba(15, 23, 42, 0.04) !important;

  overflow: hidden !important;
  box-sizing: border-box !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.trazza-indicador span {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 1 !important;

  margin: 0 !important;
  font-size: 10px !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
  letter-spacing: 0.025em !important;

  color: #334155 !important;
  white-space: normal !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.trazza-indicador b {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;

  align-self: center !important;

  margin: 0 !important;
  min-width: 38px !important;

  font-size: 27px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-align: right !important;

  color: #123f69 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.trazza-indicador small {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 2 !important;

  margin: 2px 0 0 !important;

  font-size: 9px !important;
  line-height: 1.15 !important;
  font-weight: 750 !important;

  color: #64748b !important;
  white-space: normal !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.is-crews {
  border-left: 5px solid #2563eb !important;
  background: #eff6ff !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.is-done {
  border-left: 5px solid #16a34a !important;
  background: #f0fdf4 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.is-failed {
  border-left: 5px solid #ea580c !important;
  background: #fff7ed !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera
.is-pending {
  border-left: 5px solid #ca8a04 !important;
  background: #fefce8 !important;
}

@media (max-width: 1100px) {
  .main > .topbar.trazza-cabecera-con-indicadores,
  .main .topbar.trazza-cabecera-con-indicadores,
  .topbar.trazza-cabecera-con-indicadores {
    min-height: 138px !important;
    height: 138px !important;
  }

  #trazzaRutaIndicadores.trazza-indicadores-en-cabecera {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  .main > .topbar.trazza-cabecera-con-indicadores,
  .main .topbar.trazza-cabecera-con-indicadores,
  .topbar.trazza-cabecera-con-indicadores {
    min-height: 270px !important;
    height: 270px !important;
  }

  #trazzaRutaIndicadores.trazza-indicadores-en-cabecera {
    grid-template-columns: 1fr !important;
  }
}


/* TRAZZA_INDICADORES_COMPACTOS_CSS_V3 */

.main > .topbar.trazza-cabecera-con-indicadores,
.main .topbar.trazza-cabecera-con-indicadores,
.topbar.trazza-cabecera-con-indicadores {
  min-height: 54px !important;
  height: 54px !important;
  padding: 5px 10px !important;
  align-items: center !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos {
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  height: auto !important;
  align-items: center !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.trazza-indicador {
  height: 42px !important;
  min-height: 42px !important;
  padding: 5px 10px !important;
  border-radius: 10px !important;
  border-width: 1px !important;
  box-shadow: 0 1px 4px rgba(15,23,42,.06) !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  grid-template-rows: auto auto !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.trazza-indicador span {
  font-size: 9px !important;
  line-height: 1.05 !important;
  letter-spacing: .04em !important;
  margin: 0 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.trazza-indicador b {
  font-size: 19px !important;
  line-height: 1 !important;
  min-width: 24px !important;
  margin: 0 !important;
  align-self: center !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.trazza-indicador small {
  font-size: 8px !important;
  line-height: 1 !important;
  margin-top: 1px !important;
  color: #64748b !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.is-crews {
  background: #f8fbff !important;
  border-left: 3px solid #1d4ed8 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.is-done {
  background: #f6fff8 !important;
  border-left: 3px solid #16a34a !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.is-failed {
  background: #fffaf5 !important;
  border-left: 3px solid #ea580c !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos
.is-pending {
  background: #fffef7 !important;
  border-left: 3px solid #ca8a04 !important;
}

@media (max-width: 900px) {
  .main > .topbar.trazza-cabecera-con-indicadores,
  .main .topbar.trazza-cabecera-con-indicadores,
  .topbar.trazza-cabecera-con-indicadores {
    min-height: 96px !important;
    height: 96px !important;
  }

  #trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos {
    max-width: 520px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  .main > .topbar.trazza-cabecera-con-indicadores,
  .main .topbar.trazza-cabecera-con-indicadores,
  .topbar.trazza-cabecera-con-indicadores {
    min-height: 176px !important;
    height: 176px !important;
  }

  #trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-indicadores-compactos {
    grid-template-columns: 1fr !important;
    max-width: 260px !important;
  }
}


/* TRAZZA_BARRA_OPERATIVA_CSS_V4 */

.main > .topbar.trazza-cabecera-con-indicadores,
.main .topbar.trazza-cabecera-con-indicadores,
.topbar.trazza-cabecera-con-indicadores {
  min-height: 46px !important;
  height: 46px !important;
  padding: 5px 14px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  background: #ffffff !important;
  border: 1px solid #d9e3ee !important;
  border-radius: 12px !important;

  overflow: hidden !important;
  box-sizing: border-box !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  width: auto !important;
  max-width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;

  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item {
  position: relative !important;

  display: flex !important;
  align-items: center !important;
  gap: 8px !important;

  flex: 0 0 auto !important;

  width: auto !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;

  margin: 0 !important;
  padding: 0 16px !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;

  overflow: visible !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item:first-child {
  padding-left: 4px !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;

  top: 7px !important;
  right: 0 !important;

  width: 1px !important;
  height: 20px !important;

  background: #d7e0ea !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item::before {
  content: "" !important;

  flex: 0 0 auto !important;

  width: 7px !important;
  height: 7px !important;

  border-radius: 999px !important;
  background: #64748b !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item.is-crews::before {
  background: #2563eb !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item.is-done::before {
  background: #16a34a !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item.is-failed::before {
  background: #ea580c !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item.is-pending::before {
  background: #ca8a04 !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item span {
  display: block !important;

  margin: 0 !important;

  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 800 !important;

  letter-spacing: 0 !important;
  text-transform: none !important;

  color: #475569 !important;
  white-space: nowrap !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item b {
  display: block !important;

  margin: 0 !important;
  min-width: 16px !important;

  font-size: 18px !important;
  line-height: 1 !important;
  font-weight: 950 !important;

  color: #0f2942 !important;
  text-align: left !important;
}

#trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
.trazza-barra-item small {
  display: none !important;
}

@media (max-width: 900px) {
  .main > .topbar.trazza-cabecera-con-indicadores,
  .main .topbar.trazza-cabecera-con-indicadores,
  .topbar.trazza-cabecera-con-indicadores {
    min-height: 46px !important;
    height: 46px !important;
    padding: 5px 8px !important;
  }

  #trazzaRutaIndicadores.trazza-indicadores-en-cabecera.trazza-barra-operativa
  .trazza-barra-item {
    padding: 0 11px !important;
  }
}