/* CARGODEC TARJETAS OPERACION OFICIAL V4 */

/* 3 tarjetas en escritorio */
#dash .vehicle-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,620px)) !important;
  justify-content:start !important;
  gap:12px !important;
  align-items:start !important;
}

#dash .vehicle-grid > .opTripCardV2{
  width:100% !important;
  max-width:620px !important;
  justify-self:start !important;
}

/* CABECERA */
#dash .opTripCardV2 .proVehHead{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:5px !important;
  min-height:52px !important;
  padding-bottom:8px !important;
  margin-bottom:8px !important;
  overflow:visible !important;
}

#dash .opTripCardV2 .proVehHead .vehName{
  display:flex !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  gap:4px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
  font-size:14px !important;
  white-space:nowrap !important;
}

/* placas mas cerca */
#dash .opTripCardV2 .inlinePlate,
#dash .opTripCardV2 .vehPlacas{
  margin-left:2px !important;
  font-size:14px !important;
  white-space:nowrap !important;
}

/* destino mas hacia la izquierda */
#dash .opTripCardV2 .destinoInline{
  margin-left:6px !important;
  min-width:130px !important;
  width:145px !important;
  max-width:145px !important;
  flex:0 0 145px !important;
}

#dash .opTripCardV2 .destinoSelect{
  width:145px !important;
  max-width:145px !important;
  height:34px !important;
  padding:4px 7px !important;
  font-size:11px !important;
}

/* R1 + DODA arriba */
#dash .cargoHeaderActions{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  margin-left:auto !important;
  flex:0 0 auto !important;
}

#dash .cargoHeaderActions button{
  width:36px !important;
  min-width:36px !important;
  height:36px !important;
  padding:0 !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #c9d8ee !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#075fc7 !important;
  font-size:16px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}

#dash .cargoHeaderActions .cargoR1Header{
  font-size:13px !important;
}

#dash .cargoHeaderActions button:hover{
  background:#edf5ff !important;
  border-color:#75a8e5 !important;
}

/* ZONA SEMAFORO */
#dash .opTripCardV2 .tripTopSummary{
  display:grid !important;
  grid-template-columns:auto minmax(180px,1fr) 158px !important;
  gap:8px !important;
  align-items:center !important;
}

/* Estatus de cruce mas angosto */
#dash .opTripCardV2 .tripStatusSummary{
  min-width:0 !important;
}

#dash .opTripCardV2 .tripStatusText{
  min-width:0 !important;
}

#dash .opTripCardV2 .tripStatusText .viajeSelect{
  width:215px !important;
  max-width:215px !important;
  min-width:0 !important;
  height:34px !important;
  padding:5px 8px !important;
  font-size:11px !important;
}

/* TOTAL GUIAS mas ancho */
#dash .opTripCardV2 .tripTotalGuias{
  width:158px !important;
  min-width:158px !important;
  max-width:158px !important;
  height:88px !important;
  padding:7px 8px !important;
}

#dash .opTripCardV2 .tripTotalGuias strong{
  font-size:28px !important;
}

#dash .opTripCardV2 .tripTotalGuias small{
  font-size:9px !important;
  white-space:nowrap !important;
}

/* ACCIONES INFERIORES: SOLO ICONOS */
#dash .opTripCardV2 .vehicleActions{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:8px !important;
  border-top:1px solid #e5eaf1 !important;
  margin-top:10px !important;
  padding-top:9px !important;
  min-height:54px !important;
}

#dash .opTripCardV2 .vehicleActions > .btn,
#dash .opTripCardV2 .vehicleActions > a{
  width:38px !important;
  min-width:38px !important;
  max-width:38px !important;
  height:38px !important;
  min-height:38px !important;
  padding:0 !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:10px !important;
  font-size:18px !important;
  line-height:1 !important;
  text-decoration:none !important;
  overflow:hidden !important;
}

/* texto DODA inferior ya no se necesita */
#dash .opTripCardV2 .vehicleActions > .subtle{
  display:none !important;
}

/* la accion DODA real se mueve a la cabecera */
#dash .opTripCardV2 .vehicleActions button[onclick*="subirDodaViaje"]{
  display:none !important;
}

@media(max-width:1350px){
  #dash .vehicle-grid{
    grid-template-columns:repeat(2,minmax(0,620px)) !important;
  }
}

@media(max-width:800px){
  #dash .vehicle-grid{
    grid-template-columns:1fr !important;
  }

  #dash .opTripCardV2 .tripTopSummary{
    grid-template-columns:1fr !important;
  }

  #dash .opTripCardV2 .tripStatusText .viajeSelect{
    width:100% !important;
    max-width:none !important;
  }
}


/* === COMPACTO EXTRA V2 === */
#dash .vehicle-grid{
  grid-template-columns:repeat(3,minmax(0,580px)) !important;
  justify-content:start !important;
  gap:10px !important;
}

#dash .vehicle-grid > .opTripCardV2,
#dash .opTripCardV2{
  width:100% !important;
  max-width:580px !important;
  min-height:auto !important;
}

#dash .opTripCardV2{
  border-radius:18px !important;
}

#dash .opTripCardV2 .tripHeader{
  padding:8px 14px !important;
  min-height:58px !important;
}

#dash .opTripCardV2 .tripHeader .tipoEquipo,
#dash .opTripCardV2 .tripHeader .tripCaja,
#dash .opTripCardV2 .tripHeader .tripPlacas{
  font-size:12px !important;
  line-height:1.1 !important;
}

#dash .opTripCardV2 .tripHeader .tripCaja strong,
#dash .opTripCardV2 .tripHeader .tripPlacas strong{
  font-size:13px !important;
}

#dash .opTripCardV2 .tripHeader .destinoWrap select{
  font-size:12px !important;
  height:40px !important;
  padding:6px 28px 6px 10px !important;
}

#dash .opTripCardV2 .tripHeader .r1Btn,
#dash .opTripCardV2 .tripHeader .dodaBtn,
#dash .opTripCardV2 .tripHeader .headerIconBtn{
  width:54px !important;
  min-width:54px !important;
  height:40px !important;
  font-size:12px !important;
}

#dash .opTripCardV2 .tripBody{
  padding:10px 14px 8px 14px !important;
}

#dash .opTripCardV2 .fotosWrap img,
#dash .opTripCardV2 .tripFotos img{
  width:118px !important;
  height:86px !important;
  object-fit:cover !important;
  border-radius:12px !important;
}

#dash .opTripCardV2 .semaforoBlock{
  gap:10px !important;
}

#dash .opTripCardV2 .semaforoTitulo,
#dash .opTripCardV2 .estatusCruceLabel,
#dash .opTripCardV2 .miniLabel,
#dash .opTripCardV2 .pedHeadCell{
  font-size:11px !important;
  line-height:1.1 !important;
}

#dash .opTripCardV2 .estatusCruceSelect{
  height:40px !important;
  font-size:11px !important;
  padding:6px 30px 6px 10px !important;
}

#dash .opTripCardV2 .estatusCruceTexto,
#dash .opTripCardV2 .estatusFecha{
  font-size:11px !important;
}

#dash .opTripCardV2 .totalGuiasBox{
  width:168px !important;
  min-width:168px !important;
  padding:10px 10px !important;
  border-radius:16px !important;
}

#dash .opTripCardV2 .totalGuiasBox .titulo,
#dash .opTripCardV2 .totalGuiasBox .sub{
  font-size:11px !important;
  line-height:1.1 !important;
}

#dash .opTripCardV2 .totalGuiasBox .num{
  font-size:30px !important;
  line-height:1 !important;
}

#dash .opTripCardV2 .pedTableHead,
#dash .opTripCardV2 .pedRow{
  grid-template-columns:60px 145px 82px 95px 90px 150px !important;
}

#dash .opTripCardV2 .pedTableHead{
  padding:8px 10px !important;
}

#dash .opTripCardV2 .pedHeadCell{
  font-size:10px !important;
  letter-spacing:.2px !important;
}

#dash .opTripCardV2 .pedRow{
  min-height:56px !important;
  padding:7px 10px !important;
}

#dash .opTripCardV2 .pedCell{
  font-size:11px !important;
}

#dash .opTripCardV2 .tipoCell b,
#dash .opTripCardV2 .pedNumber{
  font-size:13px !important;
}

#dash .opTripCardV2 .pedIcon{
  width:36px !important;
  min-width:36px !important;
  height:36px !important;
  font-size:11px !important;
}

#dash .opTripCardV2 .statusCell select,
#dash .opTripCardV2 .statusCell .statusSelect{
  height:40px !important;
  font-size:11px !important;
  padding:6px 26px 6px 10px !important;
  min-width:140px !important;
}

#dash .opTripCardV2 .pedPager{
  padding:8px 10px !important;
  min-height:44px !important;
  font-size:11px !important;
}

#dash .opTripCardV2 .tripFooter{
  padding:8px 10px !important;
  min-height:58px !important;
  gap:6px !important;
}

#dash .opTripCardV2 .tripFooter .footerBtn,
#dash .opTripCardV2 .tripFooter button,
#dash .opTripCardV2 .tripFooter a{
  font-size:10px !important;
  line-height:1 !important;
  padding:4px 6px !important;
}

#dash .opTripCardV2 .tripFooter .footerHint,
#dash .opTripCardV2 .tripFooter .dodaHint{
  font-size:10px !important;
}

@media (max-width:1700px){
  #dash .vehicle-grid{
    grid-template-columns:repeat(2,minmax(0,580px)) !important;
  }
}

@media (max-width:1200px){
  #dash .vehicle-grid{
    grid-template-columns:repeat(1,minmax(0,580px)) !important;
  }
}
/* === END COMPACTO EXTRA V2 === */

/* AJUSTE FINAL TABLA Y ACCIONES V5 */

/* TABLA: 6 columnas reales visibles */
#dash .opTripCardV2 .pedTableHead,
#dash .opTripCardV2 .pedRow{
  grid-template-columns:
    48px
    154px
    62px
    86px
    74px
    minmax(112px,1fr) !important;
}

/* quitar ACTUALIZACION para que no empuje ESTATUS */
#dash .opTripCardV2 .pedTableHead > span:nth-child(7),
#dash .opTripCardV2 .pedRow .updCell{
  display:none !important;
}

#dash .opTripCardV2 .pedTableHead{
  padding:6px 7px !important;
}

#dash .opTripCardV2 .pedTableHead span{
  font-size:9px !important;
}

#dash .opTripCardV2 .pedRow{
  min-height:48px !important;
  padding:5px 7px !important;
}

#dash .opTripCardV2 .pedCell{
  min-width:0 !important;
  font-size:10px !important;
}

#dash .opTripCardV2 .pedNumber{
  font-size:12px !important;
}

#dash .opTripCardV2 .pedIcon{
  width:30px !important;
  min-width:30px !important;
  height:30px !important;
  padding:0 !important;
  font-size:10px !important;
}

#dash .opTripCardV2 .numCell{
  font-size:11px !important;
  white-space:nowrap !important;
}

/* ESTATUS ya no se sale de la tarjeta */
#dash .opTripCardV2 .statusCell{
  min-width:0 !important;
  overflow:hidden !important;
}

#dash .opTripCardV2 .statusCell select{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:34px !important;
  padding:4px 23px 4px 8px !important;
  font-size:10px !important;
}

/* ACCIONES INFERIORES: SOLO ICONOS */
#dash .opTripCardV2 .vehicleActions{
  min-height:48px !important;
  padding:7px 8px !important;
  gap:9px !important;
  justify-content:center !important;
}

#dash .opTripCardV2 .vehicleActions > a,
#dash .opTripCardV2 .vehicleActions > button{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 !important;
  font-size:0 !important;
  overflow:visible !important;
}

/* CARTA PORTE */
#dash .opTripCardV2 .vehicleActions
a[href*="/api/carta-porte/"]::before{
  content:"\1F4C4";
  font-size:16px;
}

/* COPIAR */
#dash .opTripCardV2 .vehicleActions
button[onclick*="copiarCuadroResumen"]::before{
  content:"\2398";
  font-size:17px;
}

/* AGREGAR */
#dash .opTripCardV2 .vehicleActions
button[onclick*="agregarLotesViaje"]::before{
  content:"+";
  font-size:21px;
  font-weight:900;
}

/* ELIMINAR */
#dash .opTripCardV2 .vehicleActions
button[onclick*="eliminarViaje"]::before{
  content:"\2715";
  font-size:16px;
  font-weight:900;
}

/* LIBERADO */
#dash .opTripCardV2 .vehicleActions
button[onclick*="marcarViajeLiberado"]::before{
  content:"\2713";
  font-size:18px;
  font-weight:900;
}

/* DODA ya esta arriba */
#dash .opTripCardV2 .vehicleActions
button[onclick*="subirDodaViaje"],
#dash .opTripCardV2 .vehicleActions > .subtle{
  display:none !important;
}

/* FIN AJUSTE FINAL TABLA Y ACCIONES V5 */