/* CARGODEC - PAGINA AISLADA DE TARJETAS V1 */ html.__cargoStandaloneDesactivado, html.__cargoStandaloneDesactivado body{ background:#eef3f8 !important; margin:0 !important; padding:0 !important; width:100% !important; min-height:100% !important; } #dash.cargoOperacionOficial{ overflow:auto !important; } /* Solo esta pagina recibe estos ajustes. El index normal NO utiliza este CSS. */ #dash.cargoOperacionOficial #dash{ display:block !important; width:100% !important; max-width:none !important; min-height:100vh !important; margin:0 !important; padding:12px !important; box-sizing:border-box !important; background:#eef3f8 !important; } #dash.cargoOperacionOficial .vehicle-grid{ margin-left:0 !important; margin-right:0 !important; } /* No modificar aqui todavia el diseno de las tarjetas. Primero validamos que todas las funciones trabajen. */ /* === TARJETAS PARALELAS COMPACTAS V1 === */ #dash.cargoOperacionOficial #dashList .vehicle-grid{ display:grid !important; grid-template-columns:repeat(3,minmax(0,560px)) !important; justify-content:start !important; align-items:start !important; gap:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2{ width:100% !important; max-width:560px !important; } /* BOTONES INFERIORES SOLO ICONOS */ #dash.cargoOperacionOficial #dashList .vehicleActions{ display:flex !important; justify-content:center !important; align-items:center !important; gap:12px !important; padding:7px !important; min-height:48px !important; } #dash.cargoOperacionOficial #dashList .vehicleActions > a, #dash.cargoOperacionOficial #dashList .vehicleActions > button{ width:38px !important; min-width:38px !important; max-width:38px !important; height:38px !important; min-height:38px !important; padding:0 !important; margin:0 !important; font-size:0 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; border-radius:10px !important; } /* CARTA PORTE */ #dash.cargoOperacionOficial #dashList .vehicleActions a[href*="/api/carta-porte/"]::before{ content:"\1F4C4"; font-size:18px; } /* COPIAR CUADRO */ #dash.cargoOperacionOficial #dashList .vehicleActions button[onclick*="copiarCuadroResumen"]::before{ content:"\2398"; font-size:19px; } /* AGREGAR LOTES */ #dash.cargoOperacionOficial #dashList .vehicleActions button[onclick*="agregarLotesViaje"]::before{ content:"+"; font-size:24px; font-weight:900; } /* ELIMINAR VIAJE */ #dash.cargoOperacionOficial #dashList .vehicleActions button[onclick*="eliminarViaje"]::before{ content:"\2715"; font-size:18px; font-weight:900; } /* LIBERADO */ #dash.cargoOperacionOficial #dashList .vehicleActions button[onclick*="marcarViajeLiberado"]::before{ content:"\2713"; font-size:21px; font-weight:900; } /* DODA YA ESTA ARRIBA JUNTO A R1 */ #dash.cargoOperacionOficial #dashList .vehicleActions button[onclick*="subirDodaViaje"]{ display:none !important; } #dash.cargoOperacionOficial #dashList .vehicleActions > .subtle{ display:none !important; } /* LETRA GENERAL UN POCO MAS COMPACTA */ #dash.cargoOperacionOficial #dashList .pedTableHead span{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .pedRow{ min-height:46px !important; } #dash.cargoOperacionOficial #dashList .pedCell{ font-size:10px !important; } #dash.cargoOperacionOficial #dashList .pedNumber{ font-size:12px !important; } @media(max-width:1700px){ #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns:repeat(2,minmax(0,560px)) !important; } } @media(max-width:1150px){ #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns:minmax(0,560px) !important; } } /* === FIN TARJETAS PARALELAS COMPACTAS V1 === */ /* SOLO ICONOS REALES V2 */ #dash.cargoOperacionOficial #dashList .vehicleActions{ display:flex !important; justify-content:center !important; align-items:center !important; gap:12px !important; padding:7px !important; min-height:48px !important; } #dash.cargoOperacionOficial #dashList .vehicleActions > .cargoSoloIcono{ 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; font-size:24px !important; line-height:1 !important; overflow:hidden !important; white-space:nowrap !important; border-radius:10px !important; text-decoration:none !important; } #dash.cargoOperacionOficial #dashList .vehicleActions > .subtle{ display:none !important; } /* ICONOS UNICOS V1 */ /* El icono real ya esta dentro del boton. Anular pseudo-iconos heredados del CSS principal. */ #dash.cargoOperacionOficial #dashList .vehicleActions > .cargoSoloIcono::before, #dash.cargoOperacionOficial #dashList .vehicleActions > .cargoSoloIcono::after{ content:none !important; display:none !important; } #dash.cargoOperacionOficial #dashList .vehicleActions > .cargoSoloIcono{ font-size:24px !important; } /* === AJUSTE FINO COLUMNAS V1 === */ /* TIPO 68 PEDIMENTO 132 GUIAS 58 VALOR 82 PESO 68 ESTATUS 105 */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ grid-template-columns: 68px 132px 58px 82px 68px 105px !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell{ padding-left:4px !important; white-space:nowrap !important; } /* PEDIMENTO un poco mas a la derecha */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell{ padding-left:7px !important; } /* GUIAS / VALOR / PESO compactos */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .numCell{ padding-left:3px !important; padding-right:3px !important; font-size:10px !important; white-space:nowrap !important; } /* ESTATUS mas chico y angosto */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; padding-left:3px !important; padding-right:2px !important; overflow:visible !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ width:105px !important; min-width:105px !important; max-width:105px !important; height:32px !important; padding:3px 20px 3px 7px !important; font-size:9px !important; font-weight:800 !important; } /* encabezados alineados con las nuevas columnas */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ font-size:9px !important; } /* === FIN AJUSTE FINO COLUMNAS V1 === */ /* === AJUSTE FINO COLUMNAS V2 === */ /* Recorrer GUIAS / VALOR / PESO / ESTATUS ligeramente a la izquierda */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ grid-template-columns: 68px 124px 55px 80px 66px 100px !important; } /* Pedimento conserva espacio suficiente para numero + botones */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell{ padding-left:5px !important; padding-right:1px !important; } /* Numeros un poco mas juntos */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .numCell{ padding-left:1px !important; padding-right:2px !important; } /* Estatus mas compacto */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ padding-left:0 !important; padding-right:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ width:100px !important; min-width:100px !important; max-width:100px !important; height:31px !important; padding:3px 18px 3px 6px !important; font-size:8px !important; font-weight:800 !important; } /* encabezado ESTATUS tambien apenas mas chico */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead span:last-child{ font-size:8px !important; } /* === FIN AJUSTE FINO COLUMNAS V2 === */ /* === ALINEACION FINAL COLUMNAS V3 === */ /* Misma rejilla EXACTA para encabezado y renglones */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ grid-template-columns: 72px 126px 58px 82px 68px 118px !important; column-gap:0 !important; } /* Encabezados alineados con los datos */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ padding-left:8px !important; padding-right:8px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span{ min-width:0 !important; padding:0 3px !important; text-align:left !important; font-size:9px !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(1){ padding-left:12px !important; } /* PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2){ padding-left:5px !important; } /* GUIAS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(3){ text-align:right !important; padding-right:5px !important; } /* VALOR */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(4){ text-align:right !important; padding-right:5px !important; } /* PESO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(5){ text-align:right !important; padding-right:5px !important; } /* ESTATUS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(6){ text-align:center !important; padding:0 !important; } /* Renglones con el mismo padding del encabezado */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ padding-left:8px !important; padding-right:8px !important; } /* ESTATUS un poco mas ancho */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; width:118px !important; padding-left:2px !important; padding-right:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ width:118px !important; min-width:118px !important; max-width:118px !important; height:32px !important; padding:3px 20px 3px 8px !important; font-size:9px !important; font-weight:800 !important; } /* === FIN ALINEACION FINAL COLUMNAS V3 === */ /* === CORREGIR CORTE ESTATUS V4 === */ /* mover solamente ESTATUS ligeramente a la izquierda */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; width:auto !important; padding:0 !important; margin-left:-8px !important; overflow:visible !important; box-sizing:border-box !important; } /* conservarlo ancho pero sin salirse */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ width:114px !important; min-width:114px !important; max-width:114px !important; height:32px !important; padding:3px 20px 3px 8px !important; box-sizing:border-box !important; font-size:9px !important; } /* alinear encabezado ESTATUS con el selector */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(6){ transform:translateX(-8px) !important; text-align:center !important; } /* === FIN CORREGIR CORTE ESTATUS V4 === */ /* === ENCABEZADO ALINEADO V5 === */ /* Mantener exactamente la misma rejilla de los renglones */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ grid-template-columns: 72px 126px 58px 82px 68px 118px !important; column-gap:0 !important; padding-left:8px !important; padding-right:8px !important; } /* Quitar desplazamientos anteriores del encabezado */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span{ transform:none !important; margin:0 !important; min-width:0 !important; padding:0 !important; font-size:9px !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(1){ text-align:left !important; padding-left:12px !important; } /* PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2){ text-align:left !important; padding-left:7px !important; } /* GUIAS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(3){ text-align:right !important; padding-right:4px !important; } /* VALOR: mover encabezado a donde empiezan los valores */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(4){ text-align:left !important; padding-left:4px !important; } /* PESO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(5){ text-align:left !important; padding-left:7px !important; } /* ESTATUS alineado con inicio del selector */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(6){ text-align:left !important; padding-left:4px !important; font-size:8px !important; } /* Quitar la rayita vertical que quedo sobre / junto a la columna PEDIMENTO. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell{ border-left:none !important; } /* Evitar pseudo-separadores heredados sobre PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell::after, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2)::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2)::after{ display:none !important; content:none !important; } /* === FIN ENCABEZADO ALINEADO V5 === */ /* ========================================================== TABLA OPERACION FINAL V6 ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ display:grid !important; grid-template-columns: 66px 132px 55px 84px 70px 112px !important; column-gap:0 !important; padding-left:6px !important; padding-right:6px !important; box-sizing:border-box !important; } /* quitar cualquier desplazamiento viejo */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell{ margin:0 !important; transform:none !important; box-sizing:border-box !important; min-width:0 !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(1), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(1){ display:flex !important; align-items:center !important; justify-content:flex-start !important; padding-left:4px !important; padding-right:2px !important; } /* PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(2){ display:flex !important; align-items:center !important; justify-content:flex-start !important; padding-left:8px !important; padding-right:1px !important; border-left:none !important; border-right:none !important; } /* GUIAS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(3), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(3){ display:flex !important; align-items:center !important; justify-content:flex-end !important; padding:0 3px 0 0 !important; } /* VALOR */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(4), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(4){ display:flex !important; align-items:center !important; justify-content:flex-end !important; padding:0 3px 0 0 !important; } /* PESO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(5), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(5){ display:flex !important; align-items:center !important; justify-content:flex-end !important; padding:0 3px 0 0 !important; } /* ESTATUS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(6), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(6){ display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; } /* encabezados */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span{ font-size:8px !important; line-height:1 !important; white-space:nowrap !important; } /* estatus completo pero compacto */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ width:112px !important; min-width:112px !important; max-width:112px !important; overflow:visible !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ width:112px !important; min-width:112px !important; max-width:112px !important; height:31px !important; box-sizing:border-box !important; padding: 3px 19px 3px 6px !important; font-size:8px !important; font-weight:800 !important; } /* esconder actualizacion: la tabla visible tiene 6 columnas */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(7), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .updCell{ display:none !important; } /* quitar rayita residual de PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell::after, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2)::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(2)::after{ content:none !important; display:none !important; } /* ========================================================== PP REAL El numero comienza azul/negro. JS lo vuelve verde solo si PostgreSQL confirma PP. ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber{ color:#08264a !important; font-weight:900 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPPReal{ color:#009b45 !important; font-weight:900 !important; } /* ========================================================== HEADER COMPACTO V7 ========================================================== */ /* DESTINO MAS ANCHO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .destinoInline{ width:185px !important; min-width:185px !important; max-width:185px !important; flex:0 0 185px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .destinoSelect{ width:185px !important; min-width:185px !important; max-width:185px !important; height:34px !important; padding:4px 25px 4px 8px !important; font-size:10px !important; } /* TOTAL GUIAS MAS PEQUENO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary{ grid-template-columns: auto minmax(155px,1fr) 128px !important; gap:7px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ width:128px !important; min-width:128px !important; max-width:128px !important; height:72px !important; min-height:72px !important; padding:6px 5px !important; border-radius:13px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias strong{ font-size:22px !important; line-height:23px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias small{ font-size:7px !important; line-height:9px !important; white-space:nowrap !important; } /* R1 + DODA */ #dash.cargoOperacionOficial #dashList .cargoHeaderActions{ display:flex !important; align-items:center !important; gap:5px !important; margin-left:auto !important; flex:0 0 auto !important; } #dash.cargoOperacionOficial #dashList .cargoHeaderActions button{ width:36px !important; min-width:36px !important; max-width:36px !important; height:36px !important; min-height:36px !important; padding:0 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; font-size:14px !important; font-weight:900 !important; border-radius:10px !important; } #dash.cargoOperacionOficial #dashList .cargoDodaStandalone{ font-size:18px !important; } /* ========================================================== */ /* CARGO_TARJETAS_FIX_V9 */ /* DESTINO MAS ABIERTO */ #dash.cargoOperacionOficial #dashList .destinoInline{ width: 190px !important; min-width: 190px !important; max-width: 190px !important; flex: 0 0 190px !important; } #dash.cargoOperacionOficial #dashList .destinoSelect{ width: 190px !important; min-width: 190px !important; max-width: 190px !important; } /* TOTAL GUIAS MAS CHICO */ #dash.cargoOperacionOficial #dashList .tripTotalGuias{ width: 112px !important; min-width: 112px !important; max-width: 112px !important; height: 66px !important; min-height: 66px !important; padding: 5px 4px !important; border-radius: 12px !important; } #dash.cargoOperacionOficial #dashList .tripTotalGuias{ font-size: 8px !important; } #dash.cargoOperacionOficial #dashList .tripTotalGuias strong{ font-size: 18px !important; line-height: 18px !important; } #dash.cargoOperacionOficial #dashList .tripTotalGuias small{ font-size: 7px !important; line-height: 8px !important; white-space: nowrap !important; } /* R1 Y DODA ARRIBA */ #dash.cargoOperacionOficial #dashList .cargoHeaderActions{ display: flex !important; align-items: center !important; gap: 6px !important; margin-left: auto !important; flex: 0 0 auto !important; } #dash.cargoOperacionOficial #dashList .cargoHeaderActions .cargoHeaderBtn{ width: 38px !important; min-width: 38px !important; height: 38px !important; min-height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; border-radius: 11px !important; font-size: 18px !important; font-weight: 900 !important; } /* PEDIMENTO VERDE SOLO CUANDO PAGADO */ #dash.cargoOperacionOficial #dashList .pedNumber.cargoPedPagado{ color: #0a9f3f !important; } /* QUITAR EL SEGUNDO VERDE */ #dash.cargoOperacionOficial #dashList .cargoCruceEchoOculto{ display: none !important; } /* HORA MAS A LA IZQUIERDA */ #dash.cargoOperacionOficial #dashList .cargoHoraSemaforo{ margin-left: 0 !important; padding-left: 0 !important; text-align: left !important; justify-content: flex-start !important; align-items: center !important; } #dash.cargoOperacionOficial #dashList .cargoHoraSemaforo *{ text-align: left !important; } /* ABRIR MAS LA ZONA DE SEMAFORO / DESTINO / TOTAL */ #dash.cargoOperacionOficial #dashList .tripTopSummary{ grid-template-columns: auto minmax(170px,1fr) 112px !important; gap: 8px !important; } /* CARGO_TARJETAS_FIX_V10 */ /* TABLA: recuperar TIPO, centrar GUIAS y dar aire a ESTATUS */ #dash.cargoOperacionOficial #dashList .pedRow{ grid-template-columns: 96px 190px 82px 110px 88px 150px !important; } #dash.cargoOperacionOficial #dashList .pedHeader, #dash.cargoOperacionOficial #dashList .pedHead, #dash.cargoOperacionOficial #dashList .pedTitles{ grid-template-columns: 96px 190px 82px 110px 88px 150px !important; } #dash.cargoOperacionOficial #dashList .tipoCell{ min-width: 96px !important; max-width: 96px !important; width: 96px !important; overflow: visible !important; white-space: nowrap !important; text-align: left !important; justify-content: flex-start !important; padding-left: 4px !important; } #dash.cargoOperacionOficial #dashList .tipoCell .boxIcon, #dash.cargoOperacionOficial #dashList .tipoCell b, #dash.cargoOperacionOficial #dashList .tipoCell em{ display: inline-block !important; vertical-align: middle !important; } #dash.cargoOperacionOficial #dashList .pedCell:nth-child(3), #dash.cargoOperacionOficial #dashList .numCell.guiasCell, #dash.cargoOperacionOficial #dashList .cargoGuiasCenterV10{ text-align: center !important; justify-content: center !important; align-items: center !important; } #dash.cargoOperacionOficial #dashList .statusCell{ min-width: 150px !important; max-width: 150px !important; width: 150px !important; overflow: visible !important; } #dash.cargoOperacionOficial #dashList .statusCell select, #dash.cargoOperacionOficial #dashList .statusCell .status{ width: 150px !important; min-width: 150px !important; max-width: 150px !important; font-size: 12px !important; padding: 6px 28px 6px 12px !important; box-sizing: border-box !important; } #dash.cargoOperacionOficial #dashList .pedNumber{ color: #082b57 !important; } #dash.cargoOperacionOficial #dashList .pedNumber.cargoPedPagadoV10{ color: #0aa03f !important; } #dash.cargoOperacionOficial #dashList .cargoCruceEchoOcultoV10{ display: none !important; } #dash.cargoOperacionOficial #dashList .cargoHoraSemaforoV10{ margin-left: 0 !important; padding-left: 0 !important; text-align: left !important; justify-content: flex-start !important; align-items: center !important; } /* CARGO_SAFE_V12_START */ /* ---------------------------------------------------------- LAS DOS TARJETAS CONSERVAN LA MISMA ESTRUCTURA SUPERIOR ---------------------------------------------------------- */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary{ display:grid !important; grid-template-columns: 205px minmax(145px,1fr) 106px !important; column-gap:7px !important; align-items:center !important; } /* reservar sitio para fotos aunque una tarjeta no tenga */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini{ width:205px !important; min-width:205px !important; max-width:205px !important; } /* ---------------------------------------------------------- ESTATUS DE CRUCE ---------------------------------------------------------- */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusSummary{ min-width:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText{ min-width:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .viajeSelect{ width:100% !important; max-width:180px !important; min-width:0 !important; height:32px !important; padding: 3px 22px 3px 7px !important; font-size:8px !important; font-weight:800 !important; box-sizing:border-box !important; } /* Quitar el segundo VERDE / PENDIENTE / etc. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText > .tripSubStatus{ display:none !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText > .cargoEstadoCaja{ display:inline-flex !important; align-items:center !important; justify-content:center !important; width:max-content !important; min-width:78px !important; min-height:26px !important; padding:3px 10px !important; margin-top:2px !important; border-radius:999px !important; font-size:12px !important; line-height:1 !important; font-weight:900 !important; letter-spacing:.35px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoEstadoCaja.abierto{ color:#047857 !important; background:#ecfdf5 !important; border:1px solid #86efac !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoEstadoCaja.cerrado{ color:#1d4ed8 !important; background:#eff6ff !important; border:1px solid #93c5fd !important; } /* BOTONES REALES DEL SEMAFORO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusSummary{ grid-template-columns:92px minmax(0,1fr) !important; column-gap:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtns{ display:flex !important; align-items:center !important; justify-content:flex-start !important; gap:7px !important; width:92px !important; min-width:92px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn{ appearance:none !important; -webkit-appearance:none !important; width:25px !important; min-width:25px !important; height:25px !important; min-height:25px !important; padding:0 !important; margin:0 !important; border-radius:50% !important; border:2px solid #ffffff !important; box-shadow:0 0 0 1px #cbd5e1 !important; opacity:.42 !important; cursor:pointer !important; transition:transform .12s ease,opacity .12s ease,box-shadow .12s ease !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn.rojo{ background:#ef4444 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn.amarillo{ background:#f59e0b !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn.verde{ background:#22c55e !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn.activo{ opacity:1 !important; transform:scale(1.10) !important; box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #0f172a !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoSemBtn:disabled{ opacity:.22 !important; cursor:not-allowed !important; transform:none !important; box-shadow:0 0 0 1px #cbd5e1 !important; } /* ---------------------------------------------------------- TOTAL GUIAS MAS CHICO ---------------------------------------------------------- */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ width:106px !important; min-width:106px !important; max-width:106px !important; height:60px !important; min-height:60px !important; padding:5px 4px !important; border-radius:12px !important; font-size:7px !important; box-sizing:border-box !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias strong{ font-size:18px !important; line-height:19px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias small{ display:block !important; font-size:6px !important; line-height:7px !important; white-space:nowrap !important; } /* ---------------------------------------------------------- COLOR NUMERO PEDIMENTO Siempre oscuro de inicio. Verde SOLO si JS confirma PP real en PostgreSQL. ---------------------------------------------------------- */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPedPagado, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPedPagadoV10, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPedPagadoV11, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPPReal{ color:#082b57 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedNumber.cargoPPRealV12{ color:#079b40 !important; font-weight:900 !important; } /* CARGO_SAFE_V12_END */ /* CARGO_V14_START */ /* ========================================================== FOTOS: MISMO TAMANO, PERO MAS JUNTAS ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini{ display:flex !important; align-items:center !important; justify-content:flex-start !important; gap:3px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini img{ margin:0 !important; } /* ========================================================== ESTATUS DE CRUCE MAS COMPACTO ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .viajeSelect{ font-size:8px !important; font-weight:800 !important; height:32px !important; line-height:1 !important; padding: 3px 22px 3px 7px !important; } /* ========================================================== TOTAL GUIAS MAS CHICO Y CENTRADO ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ width:98px !important; min-width:98px !important; max-width:98px !important; height:56px !important; min-height:56px !important; padding:4px 3px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; text-align:center !important; border-radius:11px !important; box-sizing:border-box !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias *{ text-align:center !important; margin-left:auto !important; margin-right:auto !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias strong{ display:block !important; width:100% !important; font-size:17px !important; line-height:17px !important; margin-top:1px !important; margin-bottom:1px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias small{ display:block !important; width:100% !important; font-size:6px !important; line-height:7px !important; white-space:nowrap !important; } /* ========================================================== FECHA / HORA MAS COMPACTA ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText{ font-size:8px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText small{ font-size:7px !important; line-height:8px !important; } /* NO TOCAR LA TABLA */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ transform:none !important; } /* CARGO_V14_END */ /* CARGO_CENTRADO_V19_START */ /* ========================================================== TABLA COMPLETA Ahora se mueve el bloque entero, no columna por columna. ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ position:relative !important; left:7px !important; width:calc(100% - 10px) !important; margin-left:auto !important; margin-right:auto !important; box-sizing:border-box !important; } /* encabezado y renglones exactamente sobre el mismo eje */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > *, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > *{ transform:none !important; } /* ========================================================== FOTOS Despegar del borde izquierdo. La linea divisoria se mueve junto con todo el bloque. ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini{ position:relative !important; left:9px !important; margin-left:0 !important; padding-left:0 !important; gap:3px !important; } /* si la linea divisoria pertenece al bloque de fotos */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini{ padding-right:8px !important; } /* si la linea esta en el contenedor inmediato */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .photosMini + *{ position:relative !important; left:7px !important; } /* ========================================================== NO CAMBIAR ANCHOS DE COLUMNAS ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select, #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell .statusSelect{ font-size:7px !important; font-weight:800 !important; } /* CARGO_CENTRADO_V19_END */ /* CARGO_TABLA_V20_START */ /* Abrir el bloque completo. NO cambia la rejilla ni los anchos de las columnas. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ left:3px !important; width:calc(100% - 2px) !important; margin-left:0 !important; margin-right:0 !important; padding-left:1px !important; padding-right:1px !important; box-sizing:border-box !important; } /* Aprovechar hasta el borde derecho sin cortar ESTATUS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ overflow:visible !important; padding-right:2px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select, #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell .statusSelect{ box-sizing:border-box !important; max-width:100% !important; } /* CARGO_TABLA_V20_END */ /* CARGO_TABLA_V21_START */ /* Mover la tabla un poco a la derecha y centrarla SOLO en la p?gina separada de tarjetas. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ width: calc(100% - 18px) !important; margin-left: 14px !important; margin-right: 4px !important; padding-left: 0 !important; padding-right: 0 !important; box-sizing: border-box !important; } /* Mantener la alineaci?n del encabezado y renglones */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ align-items: center !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ align-items: center !important; } /* CARGO_TABLA_V21_END */ /* === CORREGIR BORDE DERECHO TABLA V22 === */ /* eliminar desplazamientos acumulados anteriores */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ position:relative !important; left:0 !important; width:calc(100% - 12px) !important; margin-left:10px !important; margin-right:2px !important; box-sizing:border-box !important; overflow:visible !important; } /* ESTATUS debe terminar completo antes del borde */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; width:100% !important; padding-right:2px !important; box-sizing:border-box !important; overflow:visible !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select, #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell .statusSelect{ width:calc(100% - 2px) !important; max-width:none !important; min-width:0 !important; box-sizing:border-box !important; overflow:visible !important; } /* La linea horizontal tambien llega hasta el final */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ border-right:none !important; } /* === FIN CORREGIR BORDE DERECHO TABLA V22 === */ /* CARGO_LINEAS_V23_START */ /* UNA SOLA GEOMETRIA: encabezado y filas empiezan y terminan exactamente igual. Se conserva la rejilla/columnas actuales. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ position:relative !important; left:0 !important; right:auto !important; transform:none !important; width:calc(100% - 18px) !important; margin-left:12px !important; margin-right:6px !important; padding-left:0 !important; padding-right:0 !important; box-sizing:border-box !important; } /* La raya superior termina donde termina la tabla */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ border-top-width:1px !important; border-bottom-width:1px !important; } /* Las rayas de cada rengl?n usan exactamente el mismo ancho */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ border-bottom-width:1px !important; } /* No permitir que ESTATUS se salga del ancho com?n */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; box-sizing:border-box !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select, #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell .statusSelect{ max-width:100% !important; box-sizing:border-box !important; } /* CARGO_LINEAS_V23_END */ /* CARGO_CENTRADO_V25_START */ /* MISMO ANCHO. SOLO mover TODO el bloque 3px a la derecha. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ position:relative !important; left:0 !important; right:auto !important; transform:none !important; width:calc(100% - 18px) !important; margin-left:15px !important; margin-right:3px !important; padding-left:0 !important; padding-right:0 !important; box-sizing:border-box !important; } /* Encabezado y datos exactamente sobre el mismo eje */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > *, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > *{ box-sizing:border-box !important; } /* No permitir que ESTATUS se salga */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ min-width:0 !important; overflow:visible !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select, #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell .statusSelect{ max-width:100% !important; box-sizing:border-box !important; } /* CARGO_CENTRADO_V25_END */ /* CARGO_COLUMNAS_V26_START */ /* Mover SOLO: GUIAS / VALOR / PESO / ESTATUS 5px hacia la izquierda. TIPO y PEDIMENTO quedan intactos. */ /* GUIAS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(3), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(3){ transform:translateX(-5px) !important; } /* VALOR */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(4), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(4){ transform:translateX(-5px) !important; } /* PESO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(5), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(5){ transform:translateX(-5px) !important; } /* ESTATUS */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:nth-child(6), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:nth-child(6){ transform:translateX(-5px) !important; } /* conservar selector completo */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell{ overflow:visible !important; } /* CARGO_COLUMNAS_V26_END */ /* CARGO_RAYAS_V27_START */ /* limpiar rayas viejas/flotantes */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span{ border-right:none !important; position:relative !important; } /* apagar pseudo-elementos que estaban dejando rayas fuera de lugar */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell::after, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span::before, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span::after{ content:none !important; display:none !important; border:none !important; background:none !important; box-shadow:none !important; } /* volver a dibujar separadores reales de columnas */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow > .pedCell:not(:last-child), #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead > span:not(:last-child){ box-shadow: inset -1px 0 0 #d9e2ee !important; } /* evitar que la raya se meta sobre PEDIMENTO */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell{ overflow:visible !important; z-index:2 !important; background:#fff !important; } /* CARGO_RAYAS_V27_END */ /* CARGO_ICONOS_FIX_V31_START */ /* SOLO EL DIBUJO DEL ICONO. NO TOCAR CONTENEDOR NI DISTRIBUCION. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > .cargoSoloIcono{ font-size:21px !important; line-height:1 !important; text-align:center !important; align-items:center !important; justify-content:center !important; padding:0 !important; } /* CARGO_ICONOS_FIX_V31_END */ /* ========================================================== CARGODEC OPERACION OFICIAL ========================================================== */ /* El dise?o queda limitado al m?dulo OPERACION. No fuerza #dash visible y no afecta otras pantallas. */ #dash.cargoOperacionOficial{ box-sizing:border-box !important; } /* conservar tres tarjetas en escritorio */ #dash.cargoOperacionOficial #dashList .vehicle-grid{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:10px !important; align-items:start !important; width:100% !important; } /* no permitir que una tarjeta empuje a las dem?s */ #dash.cargoOperacionOficial #dashList .opTripCardV2{ min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; } @media(max-width:1500px){ #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; } } @media(max-width:900px){ #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns:minmax(0,1fr) !important; } } /* ========================================================== */ /* CARGO_OFICIAL_BARRA_V2_START */ /* ========================================================== BARRA INFERIOR: SIEMPRE 5 ACCIONES EN UNA SOLA FILA ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions{ display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; width:100% !important; height:54px !important; min-height:54px !important; align-items:stretch !important; justify-content:stretch !important; gap:0 !important; padding:0 !important; margin:0 !important; overflow:hidden !important; } /* Cada accion ocupa exactamente 1/5 */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > a, #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > button{ flex:1 1 20% !important; width:auto !important; min-width:0 !important; max-width:none !important; height:54px !important; min-height:54px !important; margin:0 !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; box-sizing:border-box !important; } /* Icono centrado dentro de SU espacio */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > .cargoSoloIcono{ flex:1 1 20% !important; width:auto !important; min-width:0 !important; max-width:none !important; height:54px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:21px !important; line-height:1 !important; margin:0 !important; padding:0 !important; } /* Separadores verticales */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > *:not(:last-child){ border-right:1px solid #dbe5f0 !important; } /* Nada de DODA PENDIENTE abajo */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehicleActions > .subtle{ display:none !important; } /* ========================================================== R1 ARRIBA: SIEMPRE MOSTRAR R1 COMO TEXTO ========================================================== */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoR1Header{ width:42px !important; min-width:42px !important; height:38px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; font-size:0 !important; font-weight:900 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoR1Header::before{ content:"R1" !important; display:block !important; font-size:14px !important; line-height:1 !important; font-weight:900 !important; color:#075bc9 !important; } /* DODA conserva solamente su icono */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .cargoDodaHeader{ width:42px !important; min-width:42px !important; height:38px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; } /* CARGO_OFICIAL_BARRA_V2_END */ /* CARGO_OPCARD_SYNC_OPERACIONES_R1_START */ /* OPERACION SINGULAR: MISMA PRESENTACION VISUAL QUE OPERACIONES. VEHICLEACTIONS / BOTONES INFERIORES NO SE MODIFICAN. */ #dash.cargoOperacionOficial .vehicle-grid, #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns: repeat( auto-fill, minmax(620px,1fr) ) !important; gap:14px !important; align-items:start !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehName{ font-size:15px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary{ grid-template-columns: 230px minmax(260px,1fr) 170px !important; gap:16px !important; padding-bottom:12px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary .thumbSmall{ width:104px !important; height:76px !important; border-radius:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusSummary{ grid-template-columns: 44px minmax(0,1fr) !important; gap:10px !important; padding-left:12px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText .viajeSelect{ max-width:235px !important; height:32px !important; font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ width:170px !important; min-width:170px !important; max-width:170px !important; height:82px !important; min-height:82px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias strong{ font-size:30px !important; line-height:30px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias small{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableV2{ overflow:hidden !important; margin:0 -12px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ grid-template-columns: .58fr .98fr .72fr 1.03fr .85fr 1.08fr .9fr !important; min-width:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ font-size:9px !important; letter-spacing:.15px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead span{ padding:7px 4px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow{ min-height:56px !important; height:56px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedCell{ padding:5px 5px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell{ grid-template-columns: 15px 1fr !important; column-gap:3px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell .boxIcon{ font-size:13px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell b{ font-size:12px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell em{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell small{ display:none !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell{ display:flex !important; align-items:center !important; justify-content:flex-start !important; gap:6px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell .pedNumber{ font-size:13px !important; line-height:1 !important; margin:0 !important; letter-spacing:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell .pedIcon{ font-size:14px !important; line-height:1 !important; padding:0 2px !important; margin:0 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .numCell{ font-size:13px !important; letter-spacing:0 !important; line-height:1 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ height:28px !important; font-size:10px !important; padding:3px 5px !important; max-width:116px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .updCell{ font-size:9px !important; line-height:1.08 !important; white-space:normal !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager{ display:flex !important; align-items:center !important; justify-content:center !important; gap:20px !important; height:42px !important; border-top: 1px solid #e5eaf1 !important; color:#64748b !important; font-size:12px !important; font-weight:900 !important; letter-spacing:.2px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager button{ width:30px !important; height:30px !important; border:0 !important; border-radius:50% !important; background:#f1f5f9 !important; color:#001b44 !important; font-size:23px !important; line-height:24px !important; cursor:pointer !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager button:disabled{ opacity:.35 !important; cursor:not-allowed !important; } @media(max-width:900px){ #dash.cargoOperacionOficial #dashList .opTripCardV2{ overflow-x:auto !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .proVehHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead, #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedRow, #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager{ min-width:740px !important; } } /* CARGO_OPCARD_SYNC_OPERACIONES_R1_END */ /* CARGO_OPCARD_FONT_COMPACT_R1_START */ /* SOLO TIPOGRAFIA DE LA TARJETA. VEHICLE ACTIONS / BOTONES INFERIORES NO SE TOCAN. */ #dash.cargoOperacionOficial #dashList .opTripCardV2 .proVehHead{ font-size:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .vehName{ font-size:13px !important; line-height:1.05 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .destinoInline{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTopSummary{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusSummary{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText{ font-size:8px !important; line-height:1.05 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripStatusText small{ font-size:7px !important; line-height:1.05 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .viajeSelect{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias{ font-size:7px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias strong{ font-size:24px !important; line-height:24px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tripTotalGuias small{ font-size:8px !important; line-height:8px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedTableHead{ font-size:8px !important; letter-spacing:.10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell .boxIcon{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell b{ font-size:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .tipoCell em{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell .pedNumber{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .pedimentoCell .pedIcon{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .numCell{ font-size:11px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .statusCell select{ font-size:9px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .updCell{ font-size:8px !important; line-height:1.05 !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager{ font-size:10px !important; } #dash.cargoOperacionOficial #dashList .opTripCardV2 .opPager button{ font-size:18px !important; } /* CARGO_OPCARD_FONT_COMPACT_R1_END */ /* CARGO_OPCARD_FONT_REAL_R1_START */ /* OPERACION REAL - TIPOGRAFIA COMPACTA BOTONES INFERIORES PROTEGIDOS */ #dash #dashList .opTripCardV2 .proVehHead{ font-size:9px !important; } #dash #dashList .opTripCardV2 .vehName{ font-size:12px !important; line-height:1 !important; } #dash #dashList .opTripCardV2 .destinoInline, #dash #dashList .opTripCardV2 .destinoSelect{ font-size:8px !important; } #dash #dashList .opTripCardV2 .tripTopSummary{ font-size:8px !important; } #dash #dashList .opTripCardV2 .tripStatusSummary, #dash #dashList .opTripCardV2 .tripStatusSummary > label{ font-size:8px !important; } #dash #dashList .opTripCardV2 .tripStatusText{ font-size:7px !important; line-height:1 !important; } #dash #dashList .opTripCardV2 .tripStatusText small{ font-size:6px !important; line-height:1 !important; } #dash #dashList .opTripCardV2 .viajeSelect{ font-size:8px !important; } #dash #dashList .opTripCardV2 .tripTotalGuias{ font-size:6px !important; } #dash #dashList .opTripCardV2 .tripTotalGuias strong{ font-size:22px !important; line-height:22px !important; } #dash #dashList .opTripCardV2 .tripTotalGuias small{ font-size:7px !important; line-height:7px !important; } #dash #dashList .opTripCardV2 .pedTableHead{ font-size:7px !important; letter-spacing:0 !important; } #dash #dashList .opTripCardV2 .tipoCell .boxIcon{ font-size:10px !important; } #dash #dashList .opTripCardV2 .tipoCell b{ font-size:9px !important; } #dash #dashList .opTripCardV2 .tipoCell em{ font-size:8px !important; } #dash #dashList .opTripCardV2 .pedimentoCell .pedNumber{ font-size:10px !important; } #dash #dashList .opTripCardV2 .pedimentoCell .pedIcon{ font-size:10px !important; } #dash #dashList .opTripCardV2 .numCell{ font-size:10px !important; } #dash #dashList .opTripCardV2 .statusCell select{ font-size:8px !important; } #dash #dashList .opTripCardV2 .updCell{ font-size:7px !important; line-height:1 !important; } #dash #dashList .opTripCardV2 .opPager{ font-size:9px !important; } #dash #dashList .opTripCardV2 .opPager button{ font-size:16px !important; } /* CARGO_OPCARD_FONT_REAL_R1_END */ /* CARGO_OPERACION_FONT_DIRECTO_R1_START */ /* TARJETA REAL OPERACION - SOLO FUENTES */ #dash .opTripCardV2 .vehName{ font-size:11px !important; line-height:1 !important; } #dash .opTripCardV2 .destinoInline, #dash .opTripCardV2 .destinoSelect{ font-size:8px !important; } #dash .opTripCardV2 .proVehHead{ font-size:9px !important; } #dash .opTripCardV2 .tripTopSummary{ font-size:8px !important; } #dash .opTripCardV2 .tripStatusSummary, #dash .opTripCardV2 .tripStatusSummary > label{ font-size:8px !important; } #dash .opTripCardV2 .tripStatusText, #dash .opTripCardV2 .tripStatusText small{ font-size:7px !important; line-height:1 !important; } #dash .opTripCardV2 .viajeSelect{ font-size:8px !important; } #dash .opTripCardV2 .tripTotalGuias{ font-size:6px !important; } #dash .opTripCardV2 .tripTotalGuias strong{ font-size:20px !important; line-height:20px !important; } #dash .opTripCardV2 .tripTotalGuias small{ font-size:7px !important; } #dash .opTripCardV2 .pedTableHead{ font-size:7px !important; letter-spacing:0 !important; } #dash .opTripCardV2 .tipoCell .boxIcon{ font-size:9px !important; } #dash .opTripCardV2 .tipoCell b{ font-size:9px !important; } #dash .opTripCardV2 .tipoCell em{ font-size:8px !important; } #dash .opTripCardV2 .pedimentoCell .pedNumber{ font-size:9px !important; } #dash .opTripCardV2 .pedimentoCell .pedIcon{ font-size:9px !important; } #dash .opTripCardV2 .numCell{ font-size:9px !important; } #dash .opTripCardV2 .statusCell select{ font-size:8px !important; } #dash .opTripCardV2 .updCell{ font-size:7px !important; } #dash .opTripCardV2 .opPager{ font-size:9px !important; } #dash .opTripCardV2 .opPager button{ font-size:15px !important; } /* CARGO_OPERACION_FONT_DIRECTO_R1_END */ /* ============================================================ CARGODEC_OPERACION_MIRROR_OPERACIONES_R1Y_CSS TARJETA, CABECERA, TABLA Y PAGINACION ============================================================ */ /* TARJETA */ #dash.cargoOperacionOficial #dashList .opTripCardV2.cargoOperacionMirrorR1Y{ padding:0 !important; overflow:hidden !important; border: 1px solid #d7e1eb !important; border-radius: 18px !important; background: #fff !important; box-shadow: 0 4px 15px rgba(15,23,42,.06) !important; } /* CABECERA CAJA / PLACAS / DESTINO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .proVehHead{ min-height: 62px !important; margin: 0 !important; padding: 10px 18px !important; box-sizing: border-box !important; background: #fff !important; border-bottom: 1px solid #e2e8f0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .vehName{ color: #08264a !important; font-size: 18px !important; font-weight: 950 !important; line-height: 1.1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .inlinePlate{ color: #08264a !important; font-size: 17px !important; font-weight: 950 !important; } /* BLOQUE SUPERIOR */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary{ display:grid !important; grid-template-columns: 170px minmax(0,1fr) 145px !important; grid-template-rows: auto auto !important; column-gap: 14px !important; row-gap: 7px !important; align-items:center !important; margin: 0 !important; padding: 10px 18px 12px !important; box-sizing: border-box !important; background: #fff !important; border-bottom: 1px solid #e2e8f0 !important; } /* Todo dato adicional queda en centro superior */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary > *{ min-width: 0 !important; grid-column: 2 !important; grid-row: 1 !important; } /* FOTOS IZQUIERDA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary > .photosMini{ grid-column: 1 !important; grid-row: 1 / span 2 !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; gap: 7px !important; margin: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .photosMini .thumbSmall{ width: 78px !important; max-width: 78px !important; height: 112px !important; object-fit: cover !important; border-radius: 10px !important; } /* SEMAFORO / ESTADO CENTRO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary > .tripStatusSummary{ grid-column: 2 !important; grid-row: 2 !important; display:flex !important; align-items:center !important; flex-wrap:wrap !important; gap: 7px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripStatusSummary > label{ margin: 0 !important; color: #62748b !important; font-size: 10px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripStatusText small{ color: #08264a !important; font-size: 10px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripStatusText em{ font-size: 9px !important; } /* TOTAL GUIAS DERECHA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary > .tripTotalGuias{ grid-column: 3 !important; grid-row: 1 / span 2 !important; align-self:center !important; width: 100% !important; min-width: 0 !important; height: 82px !important; margin: 0 !important; padding: 8px !important; box-sizing: border-box !important; border: 1px solid #d4dfeb !important; border-radius: 12px !important; background: #fbfdff !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTotalGuias strong{ color: #08264a !important; font-size: 27px !important; line-height: 29px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTotalGuias small{ color: #62748b !important; font-size: 9px !important; font-weight: 900 !important; } /* TABLA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableV2{ margin: 0 !important; overflow: hidden !important; background: #fff !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableHead, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedRow{ display:grid !important; grid-template-columns: .70fr .90fr 1.45fr .68fr .92fr .82fr .92fr !important; gap: 0 !important; align-items:center !important; } /* CABECERA TABLA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableHead{ min-height: 46px !important; color: #5c7089 !important; background: #f8fafc !important; border-bottom: 1px solid #dfe6ee !important; font-size: 10px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableHead > *{ min-width: 0 !important; padding: 8px 10px !important; box-sizing: border-box !important; text-align: left !important; border: 0 !important; box-shadow: none !important; } /* RENGLON */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedRow{ min-height: 82px !important; background: #fff !important; border-bottom: 1px solid #e2e8f0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedCell{ min-width: 0 !important; padding: 8px 10px !important; box-sizing: border-box !important; border: 0 !important; box-shadow: none !important; } /* PEDIMENTO + DOCUMENTOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedimentoCell{ grid-column: span 2 !important; display:grid !important; grid-template-columns: minmax(82px,.90fr) minmax(150px,1.45fr) !important; column-gap: 7px !important; align-items:center !important; overflow: visible !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedNumber{ min-width: 0 !important; margin: 0 !important; color: #08264a !important; font-size: 14px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .cargoOpDocsR1Y{ display:flex !important; align-items:center !important; justify-content:flex-start !important; flex-wrap:nowrap !important; gap: 5px !important; min-width: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .cargoOpDocsR1Y .pedIcon{ width: 36px !important; min-width: 36px !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 !important; border-radius: 8px !important; font-size: 11px !important; font-weight: 950 !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tipoCell{ display:flex !important; align-items:center !important; gap: 5px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tipoCell b{ color: #5c7089 !important; font-size: 14px !important; font-weight: 950 !important; } /* GUIAS / VALOR / PESO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .numCell{ color: #08264a !important; font-size: 13px !important; font-weight: 900 !important; white-space: nowrap !important; } /* ESTATUS COMO OPERACIONES */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .statusCell select{ width: 100% !important; min-width: 90px !important; height: 36px !important; padding: 0 10px !important; border: 1px solid #d3dfec !important; border-radius: 10px !important; background: #f8fbff !important; color: #08264a !important; font-size: 10px !important; font-weight: 950 !important; } /* Ultima columna tecnica no visible en Operaciones */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .updCell{ display: none !important; } /* PAGINACION */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .opPager{ min-height: 62px !important; margin: 0 !important; padding: 8px 12px !important; background: #fff !important; border: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .opPager span{ color: #5c7089 !important; font-size: 11px !important; font-weight: 950 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .opPager button{ width: 40px !important; height: 40px !important; border-radius: 50% !important; } /* TABLET */ @media(max-width:900px){ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .tripTopSummary{ grid-template-columns: 150px minmax(320px,1fr) 135px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableV2{ overflow-x: auto !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedTableHead, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Y .pedRow{ min-width: 760px !important; } } /* ============================================================ CARGODEC_OPERACION_MIRROR_OPERACIONES_R1Z_CSS MISMA COMPOSICION VISUAL DE OPERACIONES ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTopSummary{ display:grid !important; grid-template-columns: 170px minmax(0,1fr) 145px !important; grid-template-rows: 54px 82px !important; column-gap: 14px !important; row-gap: 0 !important; align-items:center !important; padding: 10px 18px 10px !important; margin: 0 !important; min-height: 156px !important; max-height: 156px !important; overflow: hidden !important; } /* FOTOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTopSummary .photosMini{ grid-column: 1 !important; grid-row: 1 / span 2 !important; align-self:center !important; display:flex !important; gap: 7px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTopSummary .photosMini .thumbSmall{ width: 76px !important; min-width: 76px !important; max-width: 76px !important; height: 118px !important; min-height: 118px !important; max-height: 118px !important; object-fit: cover !important; border-radius: 10px !important; } /* CAJA + PLACAS + DESTINO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTopSummary .proVehHead{ grid-column: 2 / 4 !important; grid-row: 1 !important; min-height: 0 !important; height: 54px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; display:flex !important; align-items:center !important; background: transparent !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .proVehHead .vehName{ width: 100% !important; display:flex !important; align-items:center !important; gap: 8px !important; flex-wrap: nowrap !important; font-size: 18px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .proVehHead .destinoInline{ margin-left: auto !important; } /* SEMAFORO Y ESTADO JUSTO DEBAJO DE CAJA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary{ grid-column: 2 !important; grid-row: 2 !important; align-self:center !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; flex-wrap: nowrap !important; gap: 8px !important; min-height: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary .semaforoIcon{ flex: 0 0 auto !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusText{ min-width: 0 !important; margin: 0 !important; } /* TOTAL GUIAS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTotalGuias{ grid-column: 3 !important; grid-row: 2 !important; align-self:center !important; justify-self:stretch !important; width: 100% !important; height: 80px !important; margin: 0 !important; } /* TABLA ARRANCA INMEDIATAMENTE */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableV2{ margin: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead{ min-height: 46px !important; height: 46px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow{ min-height: 82px !important; height: 82px !important; padding: 0 !important; } /* DOCUMENTOS MAS COMPACTOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow .pedIcon{ width: 38px !important; min-width: 38px !important; max-width: 38px !important; height: 40px !important; min-height: 40px !important; max-height: 40px !important; margin: 0 !important; } /* ESTATUS VISIBLE EN CABECERA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead .cargoOpEstatusHeadR1Z{ display:block !important; visibility: visible !important; opacity: 1 !important; color: #5c7089 !important; text-align: center !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .statusCell{ text-align: center !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .opPager{ min-height: 60px !important; height: 60px !important; padding: 8px 12px !important; } /* ============================================================ CARGODEC_OPERACION_MIRROR_OPERACIONES_R1AA_CSS MICROCOMPACTACION REAL: - tarjeta mas angosta - header mas bajo - tipografias menores - fotos menores - total guias menor - tabla mas compacta - paginacion menor NO TOCAR BARRA INFERIOR. ============================================================ */ /* ============================================================ ANCHO GENERAL DE TARJETA ============================================================ */ #dash.cargoOperacionOficial #dashList .opTripCardV2.cargoOperacionMirrorR1Z{ width: 100% !important; max-width: 840px !important; min-width: 0 !important; justify-self: start !important; border-radius: 16px !important; } /* ============================================================ HEADER COMPLETO ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTopSummary{ grid-template-columns: 150px minmax(0,1fr) 122px !important; grid-template-rows: 42px 70px !important; column-gap: 10px !important; row-gap: 0 !important; min-height: 128px !important; max-height: 128px !important; padding: 8px 12px !important; } /* ============================================================ FOTOS ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .photosMini{ gap: 6px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .photosMini .thumbSmall{ width: 70px !important; min-width: 70px !important; max-width: 70px !important; height: 104px !important; min-height: 104px !important; max-height: 104px !important; border-radius: 9px !important; } /* ============================================================ CAJA / PLACAS / DESTINO ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .proVehHead{ height: 42px !important; min-height: 42px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .proVehHead .vehName{ gap: 5px !important; font-size: 15px !important; line-height: 1 !important; letter-spacing: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .inlinePlate, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .vehPlacas{ font-size: 14px !important; line-height: 1 !important; letter-spacing: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .destinoInline{ min-width: 108px !important; max-width: 125px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .destinoInline select, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .destinoSelect{ width: 118px !important; min-width: 118px !important; max-width: 118px !important; height: 32px !important; min-height: 32px !important; padding: 3px 7px !important; border-radius: 8px !important; font-size: 9px !important; line-height: 1 !important; font-weight: 900 !important; } /* ============================================================ SEMAFORO / ESTADO ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary{ gap: 6px !important; min-height: 62px !important; max-height: 62px !important; align-items: center !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary > label{ font-size: 9px !important; line-height: 1 !important; letter-spacing: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary .semaforoIcon{ width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusSummary .semLight{ width: 28px !important; min-width: 28px !important; max-width: 28px !important; height: 28px !important; min-height: 28px !important; max-height: 28px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusText{ line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusText small{ margin: 0 0 3px !important; font-size: 8px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripSubStatus{ font-size: 10px !important; line-height: 1 !important; padding: 4px 8px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripStatusText em{ margin-top: 3px !important; font-size: 8px !important; line-height: 1 !important; } /* ============================================================ TOTAL GUIAS ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTotalGuias{ width: 118px !important; min-width: 118px !important; max-width: 118px !important; height: 66px !important; min-height: 66px !important; max-height: 66px !important; padding: 6px !important; border-radius: 11px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTotalGuias{ font-size: 7px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTotalGuias strong{ margin: 2px 0 !important; font-size: 23px !important; line-height: 23px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tripTotalGuias small{ font-size: 7.5px !important; line-height: 1 !important; white-space: nowrap !important; } /* ============================================================ TABLA ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow{ grid-template-columns: .65fr .82fr 1.48fr .58fr .88fr .72fr .90fr !important; } /* HEADER TABLA */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead{ height: 38px !important; min-height: 38px !important; font-size: 8.5px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead > *{ padding: 5px 7px !important; font-size: 8.5px !important; line-height: 1 !important; } /* RENGLONES */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow{ height: 68px !important; min-height: 68px !important; max-height: 68px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedCell{ padding: 5px 7px !important; font-size: 9px !important; line-height: 1 !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tipoCell{ gap: 4px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tipoCell .boxIcon{ font-size: 10px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .tipoCell b{ font-size: 10px !important; line-height: 1 !important; } /* PEDIMENTO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedimentoCell{ grid-template-columns: 80px minmax(0,1fr) !important; column-gap: 5px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedNumber{ font-size: 11px !important; line-height: 1 !important; } /* DOCUMENTOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .cargoOpDocsR1Y{ gap: 4px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow .pedIcon{ width: 32px !important; min-width: 32px !important; max-width: 32px !important; height: 34px !important; min-height: 34px !important; max-height: 34px !important; border-radius: 7px !important; font-size: 9px !important; line-height: 1 !important; } /* GUIAS / VALOR / PESO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .numCell{ font-size: 10px !important; line-height: 1 !important; } /* ESTATUS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .statusCell select{ min-width: 82px !important; height: 30px !important; min-height: 30px !important; padding: 2px 6px !important; border-radius: 8px !important; font-size: 8.5px !important; line-height: 1 !important; } /* ============================================================ PAGINACION ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .opPager{ height: 50px !important; min-height: 50px !important; max-height: 50px !important; padding: 5px 8px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .opPager span{ font-size: 9px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .opPager button{ width: 32px !important; min-width: 32px !important; height: 32px !important; min-height: 32px !important; font-size: 11px !important; } /* ============================================================ PANTALLAS MENORES ============================================================ */ @media(max-width:900px){ #dash.cargoOperacionOficial #dashList .opTripCardV2.cargoOperacionMirrorR1Z{ max-width: 100% !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableV2{ overflow-x: auto !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedTableHead, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorR1Z .pedRow{ min-width: 720px !important; } } /* ============================================================ CARGODEC_OPERACION_MIRROR_REAL_R1AB_CSS MEDIDAS TOMADAS DE OPERACIONES.CSS: - GRID 3 / 2 / 1 - FOTOS 112 / 82 - CAJA 14 - PLACAS 13 - ESTADO 9 - TOTAL GUIAS 17 - HEADER TABLA 31 - RENGLON 55 - PAGER 42 ============================================================ */ /* ============================================================ GRID REAL DE OPERACIONES ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionGridRealR1AB, #dash.cargoOperacionOficial #dashList.cargoOperacionGridRealR1AB{ display:grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 12px !important; align-items: start !important; } /* ============================================================ TARJETA ============================================================ */ #dash.cargoOperacionOficial #dashList .opTripCardV2.cargoOperacionMirrorRealR1AB{ width: 100% !important; max-width: none !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; padding: 0 !important; overflow: hidden !important; background: #fff !important; border: 1px solid #d8e2ec !important; border-radius: 14px !important; box-shadow: 0 3px 12px rgba(15,23,42,.045) !important; } /* ============================================================ HEADER = OPERACIONES 112PX FOTOS + RESTO ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTopSummary{ display:grid !important; grid-template-columns: 112px minmax(0,1fr) !important; grid-template-rows: auto !important; gap: 10px !important; align-items: stretch !important; width: 100% !important; min-height: 0 !important; max-height: none !important; height: auto !important; margin: 0 !important; padding: 12px 12px 9px !important; box-sizing: border-box !important; border-bottom: 1px solid #e4eaf1 !important; overflow: visible !important; } /* ============================================================ FOTOS EXACTAS OPERACIONES ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .photosMini{ grid-column: auto !important; grid-row: auto !important; display:grid !important; grid-template-columns: 1fr 1fr !important; gap: 4px !important; width: 112px !important; min-width: 112px !important; max-width: 112px !important; min-height: 82px !important; height: 82px !important; margin: 0 !important; padding: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .photosMini .thumbSmall{ display:block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 82px !important; min-height: 82px !important; max-height: 82px !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border: 1px solid #dce5ef !important; border-radius: 8px !important; box-sizing: border-box !important; object-fit: cover !important; } /* ============================================================ HEAD DATA ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .cargoOp16HeadDataR1AB{ min-width: 0 !important; } /* CAJA / PLACAS / DESTINO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .proVehHead{ display:block !important; grid-column: auto !important; grid-row: auto !important; width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .vehName{ display:flex !important; align-items:center !important; gap: 7px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; color: #0f2e53 !important; font-size: 14px !important; line-height: 1 !important; font-weight: 900 !important; white-space: nowrap !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .inlinePlate, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .vehPlacas{ color: #173b62 !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; white-space: nowrap !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .destinoInline{ margin-left: auto !important; min-width: 0 !important; max-width: 145px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .destinoInline select, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .destinoSelect{ max-width: 145px !important; height: 27px !important; min-height: 27px !important; padding: 3px 7px !important; border: 1px solid #d5dfeb !important; border-radius: 7px !important; background: #fafcff !important; color: #334155 !important; font-size: 10px !important; line-height: 1 !important; font-weight: 900 !important; } /* ============================================================ META = STATUS + TOTAL GUIAS ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .cargoOp15MetaR1AB{ display:flex !important; align-items:center !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; margin-top: 9px !important; } /* STATUS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripStatusSummary{ grid-column: auto !important; grid-row: auto !important; flex: 1 1 auto !important; min-width: 0 !important; min-height: 0 !important; max-height: none !important; height: auto !important; margin: 0 !important; padding: 0 !important; gap: 4px !important; border: 0 !important; font-size: 9px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripStatusSummary > label{ margin: 0 !important; font-size: 8px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripStatusText, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripStatusText small{ font-size: 8px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripStatusText em{ font-size: 7px !important; line-height: 1 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .viajeSelect{ max-width: 165px !important; height: 27px !important; min-height: 27px !important; padding: 3px 6px !important; font-size: 9px !important; } /* SEMAFORO COMPACTO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .semaforoIcon{ min-width: 0 !important; min-height: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .semLight{ width: 18px !important; min-width: 18px !important; max-width: 18px !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; } /* TOTAL GUIAS EXACTO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTotalGuias{ grid-column: auto !important; grid-row: auto !important; flex: 0 0 auto !important; width: auto !important; min-width: 96px !important; max-width: none !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 6px 8px !important; border: 1px solid #dce6f0 !important; border-radius: 9px !important; text-align: center !important; background: #fbfdff !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTotalGuias small{ display:block !important; font-size: 8px !important; line-height: 1 !important; font-weight: 900 !important; color: #64748b !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTotalGuias strong{ display:block !important; margin: 0 !important; font-size: 17px !important; line-height: 1.05 !important; color: #123d68 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTotalGuias em{ display:block !important; margin-top: 2px !important; font-size: 7px !important; line-height: 1 !important; font-style: normal !important; font-weight: 800 !important; color: #64748b !important; white-space: nowrap !important; } /* ============================================================ TABLA = MEDIDAS EXACTAS OPERACIONES ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedTableV2{ width: 100% !important; margin: 0 !important; overflow: hidden !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedTableHead, #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedRow{ display:grid !important; grid-template-columns: 43px 70px 138px 54px 74px 63px minmax(76px,1fr) !important; align-items: center !important; column-gap: 4px !important; box-sizing: border-box !important; } /* HEADER 31PX */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedTableHead{ height: 31px !important; min-height: 31px !important; max-height: 31px !important; padding: 0 8px !important; border-bottom: 1px solid #e7edf3 !important; background: #fff !important; color: #60758d !important; font-size: 8px !important; line-height: 1 !important; font-weight: 900 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedTableHead > *{ min-width: 0 !important; padding: 0 !important; font-size: 8px !important; line-height: 1 !important; } /* ROW 55PX */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedRow{ height: auto !important; min-height: 55px !important; max-height: none !important; padding: 5px 8px !important; border-bottom: 1px solid #edf1f5 !important; background: #fff !important; font-size: 10px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedCell{ min-width: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; font-size: 10px !important; line-height: 1 !important; } /* TIPO */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tipoCell{ gap: 3px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tipoCell b{ font-size: 9px !important; line-height: 1 !important; font-weight: 900 !important; } /* PEDIMENTO + DOCUMENTOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedimentoCell{ grid-column: span 2 !important; display:grid !important; grid-template-columns: 70px 138px !important; column-gap: 4px !important; align-items: center !important; padding: 0 !important; overflow: visible !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedNumber{ margin: 0 !important; font-size: 10px !important; line-height: 1 !important; font-weight: 900 !important; color: #0e3560 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .cargoOpDocsR1Y{ display:flex !important; align-items:center !important; justify-content:flex-start !important; flex-wrap: nowrap !important; gap: 3px !important; min-width: 0 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .pedIcon{ width: 27px !important; min-width: 27px !important; max-width: 27px !important; height: 29px !important; min-height: 29px !important; max-height: 29px !important; margin: 0 !important; padding: 0 !important; border-radius: 6px !important; font-size: 8px !important; line-height: 1 !important; } /* NUMERICOS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .numCell{ padding: 0 !important; font-size: 10px !important; line-height: 1 !important; white-space: nowrap !important; } /* STATUS */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .statusCell{ min-width: 0 !important; text-align: left !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .statusCell select{ width: 100% !important; min-width: 0 !important; height: 29px !important; min-height: 29px !important; padding: 2px 5px !important; border: 1px solid #dce6f0 !important; border-radius: 7px !important; font-size: 8px !important; line-height: 1 !important; } /* ============================================================ PAGER EXACTO OPERACIONES ============================================================ */ #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .opPager{ display:flex !important; align-items:center !important; justify-content:center !important; gap: 12px !important; width: 100% !important; height: 42px !important; min-height: 42px !important; max-height: 42px !important; margin: 0 !important; padding: 0 !important; border-top: 1px solid #e8edf2 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .opPager button{ width: 29px !important; min-width: 29px !important; max-width: 29px !important; height: 29px !important; min-height: 29px !important; max-height: 29px !important; border: 0 !important; border-radius: 999px !important; background: #f1f5f9 !important; color: #163e68 !important; font-size: 16px !important; font-weight: 900 !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .opPager span{ min-width: 135px !important; text-align: center !important; font-size: 9px !important; line-height: 1 !important; font-weight: 900 !important; color: #60758d !important; } /* ============================================================ MISMO RESPONSIVE DE OPERACIONES ============================================================ */ @media(max-width:1250px){ #dash.cargoOperacionOficial #dashList .cargoOperacionGridRealR1AB, #dash.cargoOperacionOficial #dashList.cargoOperacionGridRealR1AB{ grid-template-columns: repeat(2,minmax(0,1fr)) !important; } } @media(max-width:820px){ #dash.cargoOperacionOficial #dashList .cargoOperacionGridRealR1AB, #dash.cargoOperacionOficial #dashList.cargoOperacionGridRealR1AB{ grid-template-columns: 1fr !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .tripTopSummary{ grid-template-columns: 96px minmax(0,1fr) !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .photosMini{ width: 96px !important; min-width: 96px !important; max-width: 96px !important; height: 72px !important; min-height: 72px !important; } #dash.cargoOperacionOficial #dashList .cargoOperacionMirrorRealR1AB .photosMini .thumbSmall{ height: 72px !important; min-height: 72px !important; max-height: 72px !important; } } /* ============================================================ CARGODEC_OPERACION_GRID_OPERACIONES_R1AC MISMO PATRON RESPONSIVE DE OPERACIONES: DESKTOP = 3 <= 1250 = 2 <= 820 = 1 SELECTOR MAS ESPECIFICO QUE operacion_clean.css. NO MODIFICA BOTONES INFERIORES. ============================================================ */ html body #dash.cargoOperacionOficial #dashList .vehicle-grid{ display:grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 12px !important; width: 100% !important; align-items: start !important; justify-content: stretch !important; } html body #dash.cargoOperacionOficial #dashList .vehicle-grid > .opTripCardV2{ width: 100% !important; max-width: none !important; min-width: 0 !important; justify-self: stretch !important; box-sizing: border-box !important; } @media(max-width:1250px){ html body #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns: repeat(2,minmax(0,1fr)) !important; } } @media(max-width:820px){ html body #dash.cargoOperacionOficial #dashList .vehicle-grid{ grid-template-columns: minmax(0,1fr) !important; } }