:root {
    --ecl-blue-900: #06133a;
    --ecl-blue-700: #0b2a6b;
    --ecl-blue-500: #1749d8;
    --ecl-blue-300: #5b8cff;
    --ecl-orange-500: #ff7a00;
    --ecl-orange-400: #ff9d2e;
    --ecl-orange-600: #e25a00;
    --ecl-ink: #06133a;
    --ecl-mute: #50617e;
    --ecl-bg: #eef3ff;
    --ecl-line: #e7ebf5;
    --ecl-radius: 18px;
    --ecl-grad-blue: linear-gradient(110deg,var(--ecl-blue-500),#245ce8);
    --ecl-grad-orange: linear-gradient(135deg, #ff9d2e 0%, #e25a00 100%);
    --ecl-shadow: 0 22px 50px -32px rgba(6, 19, 58, .45);
    --ecl-sidebar-w: 248px;
}


/* ---------- Layout full-width (sin .container que limite) ---------- */
.ecl-page {
    width: 100%;
    padding: 28px clamp(16px, 4vw, 48px) 60px;
    background: var(--ecl-bg);
}

/* ---------- Banner / cabecera de vista ---------- */
.ecl-hero {
    background: var(--ecl-grad-blue);
    border-radius: 22px;
    padding: 38px 40px;
    color: #fff;
    position: relative;
    overflow: hidden;
    box-shadow: 0 28px 60px -32px rgba(6, 19, 58, .6);
    margin-bottom: 24px;
}
.ecl-hero::after {
    content: "";
    position: absolute;
    top: -90px;
    right: -70px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(255, 122, 0, .5), transparent 65%);
}
.ecl-hero .ecl-kick {
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--ecl-orange-400);
}
.ecl-hero h1 {
    font-size: clamp(1.7rem, 3.5vw, 2.4rem);
    font-weight: 900;
    margin: 6px 0 0;
    letter-spacing: -.02em;
}
.ecl-hero-sub {
    margin: 10px 0 0; max-width: 620px;
    font-size: .98rem; line-height: 1.55;
    color: rgba(255,255,255,.82); position: relative; z-index: 1;
}

/* ---------- Cabecera ligera de página ---------- */
.ecl-page-head { margin: 8px 0 22px; }
.ecl-page-head h1 {
    font-size: clamp(1.4rem, 2.6vw, 1.9rem);
    font-weight: 900; color: var(--ecl-blue-900);
    margin: 0; position: relative; padding-bottom: 12px; display: inline-block;
}
.ecl-page-head h1::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 60px; height: 4px; border-radius: 4px;
    background: var(--ecl-grad-orange);
}

/* ---------- Toolbar (botón de acción de página) ---------- */
.ecl-toolbar { display: flex; justify-content: flex-end; margin: 4px 0 22px; }
@media (max-width: 575px){ .ecl-toolbar { justify-content: stretch; } .ecl-toolbar .ecl-btn { width: 100%; } }

/* ---------- Tarjeta genérica ---------- */
.ecl-card {
    background: #fff;
    border: 1px solid var(--ecl-line);
    border-radius: var(--ecl-radius);
    padding: 28px;
    box-shadow: var(--ecl-shadow);
    margin-bottom: 24px;
}

/* ---------- Encabezado de sección dentro de tarjeta ---------- */
.ecl-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 22px;
}
.ecl-section-head h2,
.ecl-section-head h3 {
    margin: 0;
    font-weight: 900;
    color: var(--ecl-blue-900);
    position: relative;
    padding-bottom: 10px;
}
.ecl-section-head h2 {
    font-size: 1.5rem;
}
.ecl-section-head h2::after,
.ecl-section-head h3::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 52px;
    height: 4px;
    border-radius: 4px;
    background: var(--ecl-grad-orange);
}

/* Encabezado de bloque con icono (formularios) */
.ecl-block-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eef1f7;
}
.ecl-block-head .ic {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 1rem;
    background: var(--ecl-grad-blue);
}
.ecl-block-head .ic.orange {
    background: var(--ecl-grad-orange);
}
.ecl-block-head h3 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--ecl-blue-900);
    padding: 0;
}
.ecl-block-head h3::after {
    display: none;
}

/* ---------- Divisor ---------- */
.ecl-divider {
    width: 100%;
    height: 4px;
    background-image: linear-gradient(to right, transparent, var(--ecl-blue-500), transparent);
    margin: 28px 0;
}

/* ---------- Inputs ---------- */
.ecl-page label,
.ecl-card label {
    font-weight: 700;
    color: var(--ecl-ink);
}
.ecl-page .form-control,
.ecl-card .form-control {
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 11px !important;
    height: auto !important;
    padding: 10px 13px !important;
    font-size: 14px !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ecl-page .form-control:focus,
.ecl-card .form-control:focus {
    border-color: var(--ecl-blue-500) !important;
    box-shadow: 0 0 0 4px rgba(23, 73, 216, .12) !important;
}
.ecl-page .form-control[type="file"] {
    padding: 8px !important;
}

/* Checkbox "copiar datos" como chip */
.ecl-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--ecl-bg);
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 8px 16px;
    font-weight: 600;
    color: var(--ecl-ink);
    cursor: pointer;
}
.ecl-chip input {
    margin: 0;
}

/* ---------- Buscador ---------- */
.ecl-search {
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 11px 16px;
    font-size: 14px;
    outline: none;
    min-width: 240px;
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.ecl-search:focus {
    border-color: var(--ecl-blue-500);
    box-shadow: 0 0 0 4px rgba(23, 73, 216, .12);
}

/* ---------- Botones ---------- */
.ecl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    font-weight: 700;
    font-size: 15px;
    padding: 12px 28px;
    border-radius: 12px;
    color: #fff;
    transition: transform .18s ease, filter .18s ease;
}
.ecl-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    text-decoration: none;
    color: #fff;
}
.ecl-btn--blue {
    background: var(--ecl-grad-blue);
    box-shadow: 0 14px 30px -14px rgba(23, 73, 216, .7);
}
.ecl-btn--orange {
    background: var(--ecl-grad-orange);
    box-shadow: 0 12px 26px -12px rgba(255, 122, 0, .7);
}

/* ---------- Botones-icono de acción (redondos) ---------- */
.ecl-act {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    border: 0;
    font-size: 14px;
    color: #fff;
    transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
    text-decoration: none;
}
.ecl-act:hover {
    transform: translateY(-2px) scale(1.05);
    filter: brightness(1.05);
    color: #fff;
}
.ecl-act + .ecl-act {
    margin-left: 6px;
}
.ecl-act--edit   {
    background: var(--ecl-blue-500);
    box-shadow: 0 8px 18px -8px rgba(23,73,216,.7);
}
.ecl-act--add    {
    background: var(--ecl-blue-700);
    box-shadow: 0 8px 18px -8px rgba(11,42,107,.7);
}
.ecl-act--delete {
    background: var(--ecl-orange-600);
    box-shadow: 0 8px 18px -8px rgba(226,90,0,.7);
}
.ecl-act--view   {
    background: var(--ecl-blue-300);
    box-shadow: 0 8px 18px -8px rgba(91,140,255,.7);
}
.ecl-act--neutral{
    background: #8a93a8;
}

/* ---------- Tablas (cuando se conserva tabla en vez de tarjetas) ---------- */
.ecl-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
}
.ecl-table thead, .ecl-table thead.bg-primary {
    background: var(--ecl-grad-blue) !important;
}
.ecl-table thead th {
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-size: .78rem !important;
    padding: 13px 14px !important;
}
.ecl-table thead th:first-child {
    border-top-left-radius: 12px !important;
}
.ecl-table thead th:last-child  {
    border-top-right-radius: 12px !important;
}
.ecl-table tbody td {
    padding: 12px 14px !important;
    border-bottom: 1px solid #eef1f7 !important;
    vertical-align: middle !important;
}
.ecl-table tbody tr:nth-child(even) {
    background: #fafbfe !important;
}
.ecl-table tbody tr:hover {
    background: #eef3ff !important;
}

/* ---------- Rejilla y tarjetas de usuario ---------- */
.ecl-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}
.ecl-user {
    background: #fff;
    border: 1px solid var(--ecl-line);
    border-radius: 16px;
    padding: 22px;
    position: relative;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ecl-user:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 45px -28px rgba(6,19,58,.5);
    border-color: rgba(23,73,216,.25);
}
.ecl-user .top {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}
.ecl-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: 1.1rem;
    color: #fff;
    background: var(--ecl-grad-blue);
}
.ecl-user .name {
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--ecl-blue-900);
    line-height: 1.2;
}
.ecl-user .data {
    font-size: .88rem;
    color: var(--ecl-mute);
    line-height: 1.7;
    word-break: break-word;
}
.ecl-user .data i {
    width: 18px;
    color: var(--ecl-blue-500);
}
.ecl-user .actions {
    position: absolute;
    top: 16px;
    right: 16px;
}

.ecl-empty {
    grid-column: 1 / -1;
    text-align: center;
    color: #8a93a8;
    padding: 30px;
}


/* ============================================================
   TABLAS DENSAS (listado de ofertas de carga y similares)
   ============================================================ */
table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0 0 !important;
    width: 100% !important;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--ecl-shadow);
}

/* ---- Cabecera oscura STICKY ---- */
table.dataTable thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--ecl-blue-900) !important;
    color: #fff !important;
    border: 0 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-size: .74rem !important;
    padding: 14px 14px !important;
    vertical-align: middle !important;
}
table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:after,
table.dataTable thead th.sorting:before,
table.dataTable thead th.sorting_asc:before,
table.dataTable thead th.sorting_desc:before {
    color: rgba(255,255,255,.6) !important;
}

/* ---- Celdas ---- */
table.dataTable tbody td {
    padding: 18px 16px !important;
    border-bottom: 1px solid #eef1f7 !important;
    border-right: 1px solid #eef3ff !important;
    vertical-align: top !important;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ecl-ink);
}
table.dataTable tbody td:last-child {
    border-right: 0 !important;
}

/* Zebra (respeta el #ffcbcb de aviso) */
table.dataTable tbody tr:nth-child(even):not([style*="background"]) {
    background: #fafbfe;
}
table.dataTable tbody tr:not([style*="background"]):hover {
    background: #eef3ff;
}

/* Primera columna (ID) destacada */
table.dataTable tbody td.clickable-cell:first-child {
    font-weight: 800;
    color: var(--ecl-blue-500);
}

/* ---- Iconos de acción sueltos (fas) ---- */
table.dataTable tbody td .fas {
    transition: transform .12s ease, color .12s ease;
}
table.dataTable tbody td .fas[onclick],
table.dataTable tbody td a > .fas {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: #f1f4fb;
    color: var(--ecl-blue-500);
    margin: 3px !important;
    font-size: 14px;
}
table.dataTable tbody td .fas[onclick]:hover,
table.dataTable tbody td a > .fas:hover {
    transform: translateY(-2px);
    background: #e3e9f9;
}
table.dataTable tbody td .fa-trash-alt,
table.dataTable tbody td .fa-ban,
table.dataTable tbody td .fa-exclamation {
    background: #fdeede !important;
    color: var(--ecl-orange-600) !important;
}
/* reloj/camión conservan su color inline */
table.dataTable tbody td .fa-clock,
table.dataTable tbody td .fa-truck,
table.dataTable tbody td .fa-arrow-up,
table.dataTable tbody td .fa-arrow-down {
    background: transparent !important;
    width: auto;
    height: auto;
    border-radius: 0;
    margin: 0 !important;
}

/* ---- Badges de ESTADO ---- */
.ecl-badge,
.ecl-badge-estado {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px;
    line-height: 1.6;
}
.estado-vendida   { background: #e6f7ec; color: #1b8a4b; }
.estado-publicada { background: #e8eefc; color: var(--ecl-blue-500); }
.estado-reservada { background: #fff2e0; color: var(--ecl-orange-600); }
.estado-proceso   { background: #eef1f7; color: var(--ecl-mute); }
.estado-rechazada,
.estado-rechazada_transportista { background: #fde7e7; color: #c0392b; }
.estado-pendiente,
.estado-pendiente_aceptacion_transportista { background: #fff7df; color: #a8851a; }

/* ---- Fieldsets ---- */
table.dataTable fieldset.p-2 {
    border: 1px solid var(--ecl-line) !important;
    border-radius: 12px !important;
    background: #fafbfe;
    margin-bottom: 6px;
}
table.dataTable fieldset.p-2 legend {
    font-size: .72rem !important;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--ecl-blue-900);
}

/* ---- Botones internos a la paleta ---- */
table.dataTable .btn.btn-info {
    background: var(--ecl-blue-500) !important;
    border-color: var(--ecl-blue-500) !important;
    color:#fff !important;
}
table.dataTable .btn.btn-info:hover {
    background: var(--ecl-blue-700) !important;
    border-color: var(--ecl-blue-700) !important;
}
table.dataTable .btn.btn-success {
    background:#1b8a4b !important;
    border-color:#1b8a4b !important;
}
table.dataTable .btn.btn-warning {
    background: var(--ecl-grad-orange) !important;
    border:0 !important;
    color:#fff !important;
}
table.dataTable .btn.btn-danger  {
    background: var(--ecl-orange-600) !important;
    border-color: var(--ecl-orange-600) !important;
}
table.dataTable .btn.rounded {
    border-radius: 10px !important;
    font-weight: 600;
}
table.dataTable tbody td .btn.fas {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto;
    height: auto;
    background-image: none;
}
table.dataTable tbody td .btn.fas.btn-primary {
    background: var(--ecl-blue-500) !important;
    color:#fff !important;
}
table.dataTable tbody td .btn.fas.btn-success {
    background:#1b8a4b !important;
    color:#fff !important;
}

/* ---- Banderas de país ---- */
table.dataTable tbody td img[src*="banderas"] {
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,.25);
    vertical-align: middle;
}

/* ---- Controles DataTables ---- */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
}
.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--ecl-blue-500) !important;
    box-shadow: 0 0 0 4px rgba(23,73,216,.12) !important;
    outline: none;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 9px !important;
    margin: 0 2px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--ecl-blue-500) !important;
    border-color: var(--ecl-blue-500) !important;
    color: #fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--ecl-blue-700) !important;
    border-color: var(--ecl-blue-700) !important;
    color: #fff !important;
}


/* ============================================================
   MENÚ DE ACCIONES (3 puntos) 
   ============================================================ */
.ecl-menu { position: relative; display: inline-block; }

.ecl-menu-btn {
    width: 38px; height: 38px; border-radius: 10px;
    display: inline-grid; place-items: center; cursor: pointer;
    border: 1px solid var(--ecl-line); background: #fff; color: var(--ecl-blue-900);
    font-size: 20px; line-height: 1; transition: background .15s ease, border-color .15s ease;
}
.ecl-menu-btn:hover { background: #f1f4fb; border-color: var(--ecl-blue-300); }
.ecl-menu-btn .ti, .ecl-menu-btn i { pointer-events: none; }

.ecl-menu-panel {
    display: none;
    position: absolute; 
    right: auto;       
    left: 100%;         
    top: 44px; 
    z-index: 1000;
    background: #fff; 
    border: 1px solid var(--ecl-line);
    border-radius: 14px; 
    box-shadow: 0 18px 45px -18px rgba(6,19,58,.45);
    padding: 6px; 
    min-width: 230px; 
    max-height: 60vh; 
    overflow-y: auto;
    text-align: left;
}
 

.ecl-menu.open .ecl-menu-panel { display: block; }

.ecl-menu-item {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 12px; border-radius: 9px;
    font-size: 13px; font-weight: 600; color: var(--ecl-ink);
    cursor: pointer; white-space: nowrap; text-decoration: none;
    transition: background .12s ease;
}
.ecl-menu-item:hover { background: #f1f4fb; text-decoration: none; color: var(--ecl-ink); }
.ecl-menu-item .ti { font-size: 17px; width: 20px; text-align: center; color: var(--ecl-blue-500); }
.ecl-menu-item.danger { color: var(--ecl-orange-600); }
.ecl-menu-item.danger .ti { color: var(--ecl-orange-600); }
.ecl-menu-item.is-link, .ecl-menu-item.is-link:hover { text-decoration: none; }

.ecl-menu-sep { height: 1px; background: var(--ecl-line); margin: 5px 8px; }

.ecl-menu-head {
    font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .5px;
    color: var(--ecl-mute); padding: 6px 12px 4px;
}

/* IMPORTANTE: evita que el scroll de DataTables corte el menú */
.dataTables_wrapper, .dataTables_scrollBody, table.dataTable td { overflow: visible !important; }


/* ============================================================
   ACORDEÓN DE DOCUMENTOS
   ============================================================ */
.ecl-collapse { margin: 6px 0; }
.ecl-collapse-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: #f1f4fb; border: 1px solid var(--ecl-line);
    border-radius: 10px; padding: 8px 14px;
    font-size: 13px; font-weight: 700; color: var(--ecl-blue-900); cursor: pointer;
}
.ecl-collapse-btn:hover { background: #e3e9f9; }
.ecl-collapse-btn .ti-folder { color: var(--ecl-blue-500); }
.ecl-collapse-count {
    background: var(--ecl-blue-500); color: #fff; border-radius: 999px;
    padding: 1px 8px; font-size: 11px; font-weight: 800;
}
.ecl-collapse-arrow { transition: transform .2s ease; }
.ecl-collapse.open .ecl-collapse-arrow { transform: rotate(180deg); }
.ecl-collapse-body { display: none; padding: 10px 4px 0; }
.ecl-collapse.open .ecl-collapse-body { display: block; }
.ecl-doc-row {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 6px 0; border-bottom: 1px solid #eef1f7; font-size: 12.5px;
}
.ecl-doc-row a { color: var(--ecl-blue-700); text-decoration: none; }
.ecl-doc-row a:hover { text-decoration: underline; }
.ecl-doc-tipo { color: var(--ecl-mute); font-size: 11px; }


/* ============================================================
   PIN TIMELINE — celda de puntos de carga/descarga
   ============================================================ */
.ecl-pin { display: flex; gap: 12px; padding: 6px 0; }
.ecl-pin + .ecl-pin { margin-top: 4px; }

.ecl-pin-rail { display: flex; flex-direction: column; align-items: center; flex: 0 0 auto; }
.ecl-pin-flag {
    width: 38px; height: 38px; border-radius: 50%;
    background: #eef3ff; border: 1px solid var(--ecl-line);
    display: grid; place-items: center; overflow: hidden;
}
.ecl-pin-flag img { width: 24px; height: auto; border-radius: 2px; }
.ecl-pin-line { flex: 1; width: 2px; min-height: 18px; background: var(--ecl-line); margin: 4px 0; }

.ecl-pin-body { flex: 1; min-width: 0; }
.ecl-pin-place { margin: 4px 0 0; font-weight: 800; font-size: 14px; color: var(--ecl-blue-900); }
.ecl-pin-cp { color: var(--ecl-mute); font-weight: 400; }

.ecl-pin-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.ecl-chip-data {
    background: #fff; border: 1px solid var(--ecl-line); border-radius: 8px;
    padding: 2px 9px; font-size: 12px; font-weight: 600; color: var(--ecl-ink);
}
.ecl-chip-data .ti { color: var(--ecl-blue-500); font-size: 14px; vertical-align: -2px; }

.ecl-pin-date { margin: 2px 0 0; font-size: 12px; color: var(--ecl-mute); }
.ecl-pin-date .ti { color: var(--ecl-blue-500); font-size: 14px; vertical-align: -2px; }

.ecl-pin-inci { margin: 8px 0 0; font-size: 12px; }
.ecl-pin-file { display: inline-block; margin-top: 4px; font-size: 12px; color: var(--ecl-blue-700); text-decoration: none; }
.ecl-pin-file:hover { text-decoration: underline; }
.ecl-pin-file .ti { vertical-align: -2px; }

/* ----- Mini-línea de estado (reloj → camión) ----- */
.ecl-track { display: flex; align-items: flex-start; gap: 4px; margin: 12px 0 4px; }
.ecl-track-step { display: flex; flex-direction: column; align-items: center; }
.ecl-track-dot {
    width: 30px; height: 30px; border-radius: 50%; position: relative;
    display: grid; place-items: center; color: #fff; font-size: 13px; flex: 0 0 auto;
}
.ecl-track-dot.is-ok { background: #1b8a4b; }
.ecl-track-dot.is-late { background: #c0392b; }
.ecl-track-dot.is-pending { background: #c7ccd8; color: #5a647d; cursor: pointer; }
.ecl-track-dot.is-pending:hover { background: var(--ecl-blue-500); color: #fff; }
.ecl-track-dir { position: absolute; font-size: 9px; top: -4px; right: -2px; }
.ecl-track-bar { flex: 1; height: 2px; background: #c7ccd8; margin-top: 14px; min-width: 18px; }
.ecl-track-bar.is-ok { background: #1b8a4b; }
.ecl-track-bar.is-late { background: #c0392b; }
.ecl-track-meta { font-size: 10.5px; color: var(--ecl-mute); text-align: center; margin-top: 4px; line-height: 1.3; }


/* ============================================================
   MINI-TARJETAS cliente / transportista (celda info)
   ============================================================ */
.ecl-info-line { font-size: 12.5px; margin-bottom: 8px; }
.ecl-info-et { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--ecl-orange-600); display: block; }

.ecl-chips-top { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.ecl-chip-co2 {
    display: inline-flex; align-items: center; gap: 5px;
    background: #eaf3de; color: #3b6d11; border-radius: 999px;
    padding: 3px 10px; font-size: 12px; font-weight: 700;
}
.ecl-track-code {
    display: inline-flex; align-items: center; gap: 5px;
    background: var(--ecl-blue-900); color: #fff; border-radius: 8px;
    padding: 3px 10px; font-size: 12px; font-weight: 700; letter-spacing: .5px;
}

.ecl-mini-card {
    background: #fff; border: 1px solid var(--ecl-line);
    border-radius: 12px; padding: 12px 14px; margin-bottom: 10px;
}
.ecl-mini-head {
    display: flex; align-items: center; gap: 8px;
    font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px;
    color: var(--ecl-blue-900); margin-bottom: 10px;
    padding-bottom: 8px; border-bottom: 1px solid #eef1f7;
}
.ecl-mini-ic {
    width: 26px; height: 26px; border-radius: 8px; flex: 0 0 auto;
    display: grid; place-items: center; color: #fff; font-size: 14px;
    background: var(--ecl-blue-500);
}
.ecl-mini-ic.orange { background: var(--ecl-orange-500); }

.ecl-kv-row { display: flex; gap: 10px; font-size: 12.5px; padding: 3px 0; align-items: baseline; }
.ecl-kv-k {
    flex: 0 0 92px; font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .3px; color: var(--ecl-mute); padding-top: 1px;
}
.ecl-kv-v { flex: 1; min-width: 0; color: var(--ecl-ink); word-break: break-word; }

.ecl-mini-actions { margin-top: 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }


/* ============================================================
   SIDEBAR LATERAL
   ============================================================ */
@media (min-width: 992px) {
    body.centrum-internal { padding-left: var(--ecl-sidebar-w); }
}

/* Navegación interna: paleta corporativa, misma anchura y comportamiento. */
body.centrum-internal .ecl-sidebar {
    position: fixed; inset: 0 auto 0 0; width: var(--ecl-sidebar-w); z-index: 1040;
    background: var(--ecl-blue-900); border-right: 1px solid rgba(255,255,255,.08);
    display: flex; flex-direction: column; padding: 22px 15px 16px;
    overflow-y: auto; transition: transform .25s ease;
}
body.centrum-internal .ecl-sidebar-logo { padding: 0 13px 20px; border-bottom: 1px solid rgba(255,255,255,.12); margin-bottom: 10px; }
body.centrum-internal .ecl-sidebar-logo img { max-width: 150px; height: auto; filter: brightness(0) invert(1); }
body.centrum-internal .ecl-sidebar-nav { display: flex; flex-direction: column; flex: 1 0 auto; gap: 3px; }
body.centrum-internal .ecl-nav-heading { margin: 17px 12px 6px; color: #a8bde4; font-size: 11px; line-height: 1.4; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; }
body.centrum-internal .ecl-nav-heading:first-child { margin-top: 6px; }
body.centrum-internal .ecl-nav-link {
    position: relative; display: flex; align-items: center; gap: 11px; min-height: 39px;
    padding: 8px 11px; border: 1px solid transparent; border-radius: 6px;
    color: #dce7ff !important; font-size: 13px; font-weight: 400; line-height: 1.4;
    text-decoration: none; white-space: normal; overflow-wrap: anywhere;
    transition: background .12s ease, color .12s ease;
}
body.centrum-internal .ecl-nav-link > .ti { font-size: 18px; width: 19px; flex: 0 0 19px; color: #a8bde4; text-align: center; }
body.centrum-internal .ecl-nav-link:hover { background: rgba(23,73,216,.16); border-color: rgba(91,140,255,.2); color: #fff !important; text-decoration: none; }
body.centrum-internal .ecl-nav-link.active { background: var(--ecl-blue-500); border-color: rgba(91,140,255,.4); color: #fff !important; font-weight: 600; }
body.centrum-internal .ecl-nav-link.active::before { content: ''; position: absolute; inset: 10px auto 10px -1px; width: 3px; border-radius: 0 3px 3px 0; background: var(--ecl-orange-500); }
body.centrum-internal .ecl-nav-link.active::after { content: ''; position: absolute; right: 10px; width: 5px; height: 5px; border-radius: 50%; background: var(--ecl-orange-400); }
body.centrum-internal .ecl-nav-link.active > .ti { color: var(--ecl-orange-400); }
body.centrum-internal .ecl-nav-link:focus-visible { outline: 2px solid var(--ecl-orange-400); outline-offset: 2px; }
body.centrum-internal .ecl-sidebar-foot { border-top: 1px solid rgba(255,255,255,.12); padding: 16px 10px 0; margin-top: 16px; flex: 0 0 auto; }
body.centrum-internal .ecl-burger { display: none; position: fixed; top: 14px; left: 14px; z-index: 1050; min-width: 44px; height: 42px; padding: 0 12px; border: 1px solid var(--ecl-orange-400); border-radius: 6px; background: var(--ecl-orange-500); color: var(--ecl-blue-900); font-size: 13px; font-weight: 600; gap: 7px; cursor: pointer; box-shadow: 0 5px 16px rgba(6,19,58,.18); }
body.centrum-internal .ecl-burger > i { font-size: 20px; }
body.centrum-internal .ecl-sidebar-overlay { display: none; position: fixed; inset: 0; z-index: 1035; background: rgba(6,19,58,.55); backdrop-filter: blur(2px); }
@media (max-width: 991px) {
    body.centrum-internal .ecl-burger { display: inline-flex; align-items: center; justify-content: center; }
    body.centrum-internal .ecl-sidebar { transform: translateX(-100%); box-shadow: 0 0 60px rgba(6,19,58,.4); }
    body.centrum-internal.ecl-sidebar-open .ecl-sidebar { transform: translateX(0); }
    body.centrum-internal.ecl-sidebar-open .ecl-sidebar-overlay { display: block; }
    body.centrum-internal.ecl-sidebar-open .ecl-burger { left: calc(var(--ecl-sidebar-w) - 58px); width: 44px; padding: 0; }
    body.centrum-internal.ecl-sidebar-open .ecl-burger > span { display: none; }
    body.centrum-internal #contenedor_principal { padding-top: 66px; }
}
@media (prefers-reduced-motion: reduce) { body.centrum-internal :is(.ecl-sidebar,.ecl-nav-link) { transition: none; } }

/* ============================================================
   FORM WIZARD — pasos numerados a la izquierda + campos a la derecha
   Pegar al final de ecl-dashboard.css
   ============================================================ */
.ff-step {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 0;
    background: #fff;
    border: 1px solid var(--ecl-line);
    border-radius: var(--ecl-radius);
    overflow: hidden;
    margin-bottom: 22px;
    box-shadow: var(--ecl-shadow);
}
@media (max-width: 767px) { .ff-step { grid-template-columns: 1fr; } }

/* Columna izquierda (el "paso") */
.ff-step-aside {
    background: linear-gradient(160deg, #f7f9fd 0%, #eef3ff 100%);
    border-right: 1px solid var(--ecl-line);
    padding: 26px 22px;
    display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
}
@media (max-width: 767px) {
    .ff-step-aside { flex-direction: row; align-items: center; border-right: 0; border-bottom: 1px solid var(--ecl-line); padding: 16px 20px; }
}


.ff-step-ic {
    width: 44px; height: 44px; border-radius: 13px;
    display: grid; place-items: center; color: #fff; font-size: 20px;
    background: var(--ecl-grad-blue);
}
.ff-step-ic.orange { background: var(--ecl-grad-orange); }
.ff-step-title {
    margin: 0; font-size: 1rem; font-weight: 800; color: var(--ecl-blue-900);
    text-transform: uppercase; letter-spacing: .5px; line-height: 1.3;
}

/* Columna derecha (campos) */
.ff-step-body { padding: 26px 28px; }
.ff-step-body label { font-weight: 700; color: var(--ecl-ink); }

/* Inputs del wizard */
.ff-step-body .form-control {
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 11px !important;
    height: auto !important;
    padding: 10px 13px !important;
    font-size: 14px !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ff-step-body .form-control:focus {
    border-color: var(--ecl-blue-500) !important;
    box-shadow: 0 0 0 4px rgba(23,73,216,.12) !important;
}
.ff-step-body .form-control[type="file"] { padding: 8px !important; }

/* Botón enviar */
.ff-submit-row { display: flex; justify-content: flex-end; margin-top: 4px; }
@media (max-width: 575px){ .ff-submit-row { justify-content: stretch; } .ff-submit-row .ecl-btn { width: 100%; } }


/* Pie de navegación: cuenta, idioma y salida, conservando sus eventos. */
body.centrum-internal .ecl-foot-bar { display: flex; flex-direction: column; align-items: stretch; gap: 11px; padding: 0; background: transparent; border: 0; border-radius: 0; text-align: left; }
body.centrum-internal .ecl-foot-user { display: grid; grid-template-columns: 32px minmax(0,1fr); column-gap: 9px; align-items: center; min-width: 0; line-height: 1.4; }
body.centrum-internal .ecl-foot-avatar { grid-column: 1; grid-row: 1 / 3; display: grid; place-items: center; width: 32px; height: 32px; background: var(--ecl-blue-700); border: 1px solid rgba(91,140,255,.4); border-radius: 7px; color: var(--ecl-orange-400); font-size: 20px; }
body.centrum-internal .ecl-foot-name { color: #fff; font-weight: 500; font-size: 12px; min-width: 0; overflow-wrap: anywhere; }
body.centrum-internal .ecl-foot-role { color: #b1c5ee; font-size: 11px; font-weight: 400; margin: 0; letter-spacing: 0; text-transform: none; }
body.centrum-internal .ecl-foot-actions { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0; margin: 0; }
body.centrum-internal .ecl-lang-circle { position: relative; flex: 1; min-width: 0; }
body.centrum-internal :is(.ecl-flag-btn,.ecl-logout-circle) { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 31px; padding: 5px 9px; border: 1px solid rgba(255,255,255,.15); border-radius: 5px; background: rgba(255,255,255,.03); color: #dce7ff !important; font-size: 11px; line-height: 1.4; text-decoration: none; cursor: pointer; }
body.centrum-internal .ecl-flag-btn { width: 100%; }
body.centrum-internal .ecl-flag-btn img { display: block; width: 20px; height: 14px; object-fit: cover; border-radius: 2px; }
body.centrum-internal .ecl-flag-btn > .ti { margin-left: auto; font-size: 13px; }
body.centrum-internal .ecl-flag-btn:hover { border-color: var(--ecl-orange-400); }
body.centrum-internal .ecl-lang-pop { position: absolute; bottom: calc(100% + 9px); left: 0; right: auto; top: auto; transform: none; z-index: 9999; width: 180px; max-width: calc(var(--ecl-sidebar-w) - 55px); background: #fff; border: 1px solid var(--ecl-line); border-top: 2px solid var(--ecl-orange-500); border-radius: 7px; padding: 5px; box-shadow: 0 10px 26px rgba(6,19,58,.22); }
body.centrum-internal .ecl-lang-pop ul { list-style: none; margin: 0; padding: 0; text-align: left; }
body.centrum-internal .ecl-lang-pop li { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 4px; font-size: 12px; font-weight: 400; color: var(--ecl-ink); cursor: pointer; }
body.centrum-internal .ecl-lang-pop li:hover { background: #f1f4fb; }
body.centrum-internal .ecl-lang-pop li.seleccionado { background: #e8eefc; color: var(--ecl-blue-500); }
body.centrum-internal .ecl-lang-pop li img { width: 20px; height: 14px; object-fit: cover; border-radius: 2px; }
body.centrum-internal .ecl-lang-pop a { text-decoration: none; }
body.centrum-internal .ecl-lang-pop.cerrado { display: none; }
body.centrum-internal .ecl-logout-circle { flex: 0 0 auto; background: transparent; border-color: rgba(255,122,0,.4); color: #ffb36a !important; }
body.centrum-internal .ecl-logout-circle > .ti { font-size: 15px; }
body.centrum-internal .ecl-logout-circle:hover { background: rgba(255,122,0,.1); border-color: var(--ecl-orange-500); color: var(--ecl-orange-400) !important; text-decoration: none; }

/* ----- MÉTRICA CELL ----- */
.ecl-metric-cell {
    cursor: pointer !important;
    padding: 14px 12px !important;
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
    border: 1px solid #e1e8ed !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.ecl-metric-cell:hover {
    background: linear-gradient(135deg, #eff6ff 0%, #f7faff 100%) !important;
    border-color: #1749d8 !important;
    box-shadow: 0 4px 12px rgba(23, 73, 216, 0.15) !important;
    transform: translateY(-1px) !important;
}

.ecl-metric-row {
    display: block;
    margin-bottom: 10px;
    line-height: 1.5;
}

.ecl-metric-row:last-child {
    margin-bottom: 0;
}

.ecl-metric-row b {
    color: #06133a;
    font-weight: 600;
    margin-right: 4px;
}

.ecl-metric-row .font-weight-bold {
    color: #ff7a00;
    font-weight: 700;
}


.dropdown-menu  {
    z-index: 9999999 !important;
}


/* Estilos internos centralizados. Los marcadores de plantilla activan solo las vistas presentes,
   incluidas las cargadas por AJAX; :where conserva la especificidad original. */

/* templates/vi/analitica.html.twig — bloque 1 */
/*
         * Maquetación propia de Analítica.
         * Los estilos generales de botones permanecen centralizados
         * en vi/botontesCompartidos.html.twig.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page .dataTables_wrapper,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page .table-responsive,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page #dataTable {
            width: 100% !important;
            max-width: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-filters {
            display: grid;
            grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
            align-items: end;
            gap: 1.25rem;
            width: 100%;
            margin-bottom: 2rem;
            padding: 22px;
            border: 1px solid var(--ecl-line);
            border-radius: 12px;
            background: #ffffff;
            box-shadow: 0 14px 30px -24px rgba(6, 19, 58, .45);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-field {
            min-width: 0;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-field label {
            display: block;
            margin-bottom: .45rem;
            font-weight: 600;
        }

        /*
         * bootstrap-datetimepicker necesita un contenedor posicionado
         * para insertar correctamente el calendario.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-field .input-group.date {
            position: relative !important;
            overflow: visible !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page .bootstrap-datetimepicker-widget {
            z-index: 3000 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-actions {
            display: flex;
            align-items: flex-end;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-actions #fetchData {
            min-width: 150px;
            justify-content: center;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-table-card {
            width: 100%;
            padding: 18px;
            border: 1px solid var(--ecl-line);
            border-radius: 12px;
            background: #ffffff;
            box-shadow: 0 14px 30px -24px rgba(6, 19, 58, .45);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page #dataTable {
            border-collapse: collapse !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page #dataTable thead {
            background: #071844 !important;
            color: #ffffff !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-page #dataTable thead th {
            color: #ffffff !important;
            border-color: rgba(255, 255, 255, .14) !important;
            vertical-align: middle;
        }

        @media (max-width: 900px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-filters {
                grid-template-columns: 1fr;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-analitica-0"])) .ecl-analytics-actions {
                justify-content: flex-start;
            }
        }

/* templates/vi/coincidencias.html.twig — bloque 1 */
/*
         * Colores y geometría de botones centralizados en
         * vi/botonesCompartidos.html.twig.
         */

/* templates/vi/contabilidad.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-page {
            width: 100%;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-content {
            margin-top: 42px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 24px;
            width: 100%;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card {
            position: relative;
            min-width: 0;
            padding: 24px;
            overflow: visible;
            background: #ffffff;
            border: 1px solid var(--ecl-line, #e4e8f1);
            border-radius: 14px;
            box-shadow: 0 16px 36px -28px rgba(6, 19, 58, .55);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 24px;
            width: 52px;
            height: 4px;
            border-radius: 0 0 4px 4px;
            background: var(--ecl-orange-500, #ff7a00);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card h2 {
            margin: 6px 0 22px;
            color: var(--ecl-blue-900, #06133a);
            font-size: 1rem;
            font-weight: 700;
            line-height: 1.45;
            text-transform: uppercase;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card form,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .row {
            margin-bottom: 0;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card label {
            display: block;
            margin-bottom: 6px;
            color: var(--ecl-ink, #1f2740);
            font-size: .84rem;
            font-weight: 600;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .form-group {
            margin-bottom: 16px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .form-control,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .bootstrap-select > .dropdown-toggle {
            min-height: 38px;
            border: 1px solid #ced4da !important;
            border-radius: 7px !important;
            background: #fff !important;
            box-shadow: none !important;
            font-size: .86rem;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .bootstrap-select,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .dropdown.bootstrap-select {
            width: 100% !important;
            border: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .bootstrap-select > .dropdown-toggle {
            display: flex;
            align-items: center;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .funcion_fecha {
            position: relative !important;
            overflow: visible !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card .bootstrap-datetimepicker-widget {
            z-index: 3000 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-actions {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 10px;
            margin-top: 6px;
        }

        /*
         * La geometría, tipografía, colores planos y hover de CSV/PDF
         * proceden exclusivamente de vi/botonesCompartidos.html.twig.
         * Aquí solo se controla la distribución dentro de la tarjeta.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-actions .ecl-btn {
            margin: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card--wide {
            grid-column: 1 / -1;
        }

        @media (max-width: 1100px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-grid {
                grid-template-columns: 1fr;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card--wide {
                grid-column: auto;
            }
        }

        @media (max-width: 767px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-content {
                margin-top: 28px;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card {
                padding: 20px 18px;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-contabilidad-0"])) .ecl-accounting-card::before {
                left: 18px;
            }
        }

/* templates/vi/documentacionCaducada.html.twig — bloque 1 */
/*
         * Los ajustes de esta tabla se limitan a la página de documentación
         * caducada. El include listadoEmpresasTransportistas sigue compartido
         * y no se modifica para no afectar a otras vistas.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page > .table-responsive,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .dataTables_wrapper {
            width: 100% !important;
            max-width: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page table {
            width: 100% !important;
            max-width: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page > .table-responsive,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .dataTables_wrapper {
            overflow-x: auto !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page td,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page td * {
            word-break: normal;
            overflow-wrap: normal;
        }

        /*
         * Solo se controla la distribución interna. Colores, geometría,
         * sombra y hover proceden de vi/botonesCompartidos.html.twig.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .ecl-docs-action-btn {
            white-space: nowrap !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .ecl-docs-action-btn i,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .ecl-docs-download-btn i {
            flex: 0 0 auto !important;
            margin-right: .5rem !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-documentacionCaducada-0"])) .ecl-expired-docs-page .ecl-docs-download-btn {
            max-width: 100% !important;
            justify-content: flex-start !important;
            text-align: left !important;
            white-space: normal !important;
            word-break: normal !important;
            overflow-wrap: normal !important;
        }

/* templates/vi/gestionPales.html.twig — bloque 1 */
/* Sobrescribe el color de text-muted a rojo de Bootstrap */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-gestionPales-0"])) .text-muted {
            color: #dc3545 !important;
        }
        /* Estilos para Signature Pad */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-gestionPales-0"])) .signature-pad-container {
            border: 1px solid #ced4da;
            border-radius: .25rem;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-gestionPales-0"])) .signature-pad-container canvas {
            width: 100%;
            height: 120px;
            touch-action: none;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-gestionPales-0"])) .modal-dialog {
            width: 800px;
            /*            max-width: unset;*/
            /*            display: unset !important;*/
        }

/* templates/vi/kpis.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page * {
            box-sizing: border-box;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page {
            width: 100%;
            max-width: none;
            min-width: 0;
        }

        /* Cabecera: mismo comportamiento visual que vistaListadoOfertasCarga. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .ecl-hero {
            width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            position: relative !important;
            overflow: hidden !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .ecl-hero > * {
            display: block !important;
            position: relative !important;
            z-index: 3 !important;
            left: auto !important;
            right: auto !important;
            top: auto !important;
            bottom: auto !important;
            transform: none !important;
            visibility: visible !important;
            opacity: 1 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .ecl-hero .ecl-kick {
            margin: 0 0 8px !important;
            color: var(--ecl-orange-500, #ff7a00) !important;
            font-size: 12px !important;
            line-height: 1.2 !important;
            font-weight: 700 !important;
            letter-spacing: 2px !important;
            text-transform: uppercase !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .ecl-hero h1 {
            margin: 0 !important;
            color: #fff !important;
            font-size: 2.35rem !important;
            line-height: 1.15 !important;
            font-weight: 700 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .ecl-hero .ecl-hero-sub {
            margin: 10px 0 0 !important;
            color: rgba(255,255,255,.78) !important;
            font-size: 1rem !important;
            line-height: 1.5 !important;
        }

        /* Filtros superiores. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters {
            width: 100%;
            max-width: none;
            margin: 2.5rem 0 1.5rem;
            padding: 22px 24px;
            background: #fff;
            border: 1px solid var(--ecl-line, #e4e8f1);
            border-radius: 14px;
            box-shadow: 0 16px 36px -28px rgba(6,19,58,.55);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters form,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .form-row {
            width: 100%;
            max-width: none;
            margin: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .form-row {
            display: grid !important;
            grid-template-columns: minmax(190px, 230px) minmax(190px, 230px) 145px minmax(300px, 360px);
            gap: 18px 22px;
            align-items: start;
            justify-content: start;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .form-group,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .funcion_fecha {
            display: block !important;
            position: static !important;
            float: none !important;
            width: auto !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            left: auto !important;
            right: auto !important;
            top: auto !important;
            bottom: auto !important;
            transform: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters label,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .date-picker-container {
            display: block !important;
            position: static !important;
            width: 100% !important;
            margin: 0 !important;
            transform: none !important;
            visibility: visible !important;
            opacity: 1 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters label {
            margin-bottom: 7px !important;
            color: var(--ecl-ink, #1f2740) !important;
            font-size: .84rem !important;
        }

        /*
         * bootstrap-datetimepicker necesita un antecesor posicionado.
         * Esta regla debe ir después de las reglas que normalizan el formulario,
         * porque allí se usa position: static !important.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .funcion_fecha,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .date-picker-container {
            position: relative !important;
            overflow: visible !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .bootstrap-datetimepicker-widget {
            z-index: 3000 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .date-picker-container input {
            display: block !important;
            position: static !important;
            width: 100% !important;
            max-width: none !important;
            margin: 0 0 6px !important;
            transform: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar {
            position: static !important;
            width: 145px !important;
            min-width: 145px;
            height: 43px !important;
            margin: 27px 0 0 !important;
            transform: none !important;
            align-self: start;
            justify-self: start;
            transition: transform .18s ease, box-shadow .18s ease,
                        background-color .18s ease, border-color .18s ease;
        }

        /*
         * Conserva el efecto de elevación de los demás botones ecl-btn.
         * La regla anterior normaliza transform para el layout, así que
         * aquí se restaura expresamente el desplazamiento al pasar el ratón.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar:focus {
            transform: translateY(-2px) !important;
            box-shadow: 0 10px 20px -12px rgba(6, 19, 58, .65) !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar:active {
            transform: translateY(0) !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-periods {
            align-self: start;
            justify-self: start;
            min-width: 0;
            margin-top: 25px;
            color: var(--ecl-ink, #1f2740);
            font-size: .88rem;
            line-height: 1.55;
            text-align: left;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-periods div + div {
            margin-top: 8px;
        }

        /* Se elimina por completo el layout lateral de la plantilla KPI antigua. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .main-panel,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .content-wrapper {
            display: block !important;
            position: static !important;
            float: none !important;
            clear: both !important;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            min-height: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            left: auto !important;
            right: auto !important;
            top: auto !important;
            bottom: auto !important;
            transform: none !important;
        }

        /* Resumen superior: dos bloques de 6 KPI y una segunda fila de 5 tarjetas. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary {
            display: grid !important;
            grid-template-columns: repeat(12, minmax(0, 1fr));
            gap: 22px;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 22px !important;
            background: #e5e5ea;
            border-radius: 14px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side {
            grid-column: span 6;
            display: grid !important;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 16px;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side > h3 {
            grid-column: 1 / -1;
            width: 100%;
            margin: 0 0 2px !important;
            text-align: center !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side > .grid-margin,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .grid-margin {
            display: flex !important;
            width: auto !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            flex: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-3 {
            grid-column: span 3;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-2 {
            grid-column: span 2;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .card {
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            border: 0 !important;
            border-radius: 10px !important;
            background: #fff;
            box-shadow: 0 10px 22px -16px rgba(6,19,58,.5);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .card-body {
            min-width: 0;
            padding: 18px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .card-title {
            line-height: 1.35;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .grid-margin {
            margin-bottom: 20px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .stretch-card {
            display: flex;
            align-items: stretch;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .icon-md {
            font-size: 1.35rem;
        }

        /* Filas de gráficas y tablas. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .content-wrapper > .row:not(.ecl-kpi-summary) {
            width: auto !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 22px -8px 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .content-wrapper > .row:not(.ecl-kpi-summary) > [class*="col-"] {
            min-width: 0;
            padding-left: 8px !important;
            padding-right: 8px !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page canvas {
            max-width: 100%;
        }

        /* Tipografía más compacta en el resumen superior. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .ecl-kpi-side > h3 {
            font-size: 1.45rem !important;
            line-height: 1.2 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .card-title {
            font-size: .82rem !important;
            line-height: 1.3 !important;
            font-weight: 500 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .card-body {
            padding: 14px 16px !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .card-body h4 {
            font-size: 1.18rem !important;
            line-height: 1.32 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .card-body p {
            font-size: .78rem !important;
            line-height: 1.4 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary .card-body small {
            font-size: .72rem !important;
        }

        /* Evitar el gris de poco contraste en los rankings inferiores. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .table tbody td,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .table tbody td.text-muted,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .table .text-muted {
            color: var(--ecl-ink, #1f2740) !important;
            opacity: 1 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-page .table thead th {
            color: var(--ecl-ink, #1f2740) !important;
        }

        @media (max-width: 1250px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .form-row {
                grid-template-columns: repeat(2, minmax(190px, 280px));
                justify-content: start;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-periods {
                justify-self: start;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 991.98px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side {
                grid-column: 1 / -1;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-3,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-2 {
                grid-column: span 6;
            }
        }

        @media (max-width: 767.98px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters .form-row {
                grid-template-columns: 1fr;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-filters #enviar {
                margin-top: 0 !important;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpis-periods {
                margin-top: 2px;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary {
                grid-template-columns: 1fr;
                padding: 16px !important;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-3,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-summary > .col-md-2 {
                grid-column: 1;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-kpis-0"])) .ecl-kpi-side {
                grid-template-columns: 1fr;
            }
        }

/* templates/vi/listadoIncidencias.html.twig — bloque 1 */
/*
         * Esta vista y cualquier contenido cargado mediante AJAX
         * deben ocupar todo el ancho disponible del área principal.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias > * {
            width: 100% !important;
            max-width: none !important;
        }

        /*
         * Algunos fragmentos antiguos pueden incluir container-custom.
         * Se neutraliza solamente dentro del listado de incidencias.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias .container-custom {
            width: 100% !important;
            max-width: none !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias .dataTables_wrapper,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias .table-responsive,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page #tabla-incidencias table {
            width: 100% !important;
            max-width: none !important;
        }

        /*
         * Centra el botón de creación sin modificar su estilo
         * ni el ancho del contenido cargado debajo.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoIncidencias-0"])) .ecl-incidencias-page .ecl-toolbar {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
        }

/* templates/vi/mapaTracking.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) html,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) body {
            background: #f0f2f5 !important;
            min-height: 100vh;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item.active {
            background-color: white;
            border-color: #dee2e6;
            color: inherit;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) b {
            font-weight: 700 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) a.fas.fa-download,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) a.fas.fa-download:active {
            color: grey !important;
            text-decoration: none;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .row[style*="height: 100%"] {
            display: flex;
            gap: 16px;
            padding: 16px;
            background: transparent !important;
            height: 100vh !important;
        }

        /* ===== PANEL IZQUIERDO - SIDEBAR PREMIUM ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas {
            background: linear-gradient(180deg, #06133a 0%, #0a1f4a 100%) !important;
            border-radius: 12px;
            box-shadow: 0 10px 40px rgba(6, 19, 58, 0.3);
            border: 1px solid rgba(255, 255, 255, 0.1);
            overflow-y: auto;
            height: 100%;
            padding: 0;
            color: white;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas::-webkit-scrollbar {
            width: 8px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas::-webkit-scrollbar-track {
            background: rgba(255, 255, 255, 0.05);
            border-radius: 4px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, #ff7a00, #ff9933);
            border-radius: 4px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(180deg, #e25a00, #ff7a00);
        }

        /* ===== HEADER DEL SIDEBAR ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:first-of-type {
            background: linear-gradient(135deg, #06133a 0%, #1749d8 100%) !important;
            color: white !important;
            border: none !important;
            border-radius: 12px 12px 0 0 !important;
            padding: 22px !important;
            margin: 0 !important;
            position: sticky;
            top: 0;
            z-index: 100;
            border-bottom: 3px solid #ff7a00 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:first-of-type p {
            color: rgba(255,255,255,0.95) !important;
            font-size: 12px;
            margin: 10px 0 !important;
            line-height: 1.6;
            font-weight: 500;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:first-of-type b {
            color: white !important;
            font-weight: 700;
            font-size: 14px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:first-of-type span {
            color: #ff9933 !important;
            font-weight: 700;
            font-size: 12px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:first-of-type img {
            max-width: 32px;
            vertical-align: middle;
            margin-right: 8px;
            filter: drop-shadow(0 2px 6px rgba(0,0,0,0.2));
        }

        /* ===== PROGRESS BAR TIMELINE ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .progress {
            height: 70px !important;
            background: rgba(255, 255, 255, 0.1) !important;
            border-radius: 8px !important;
            margin: 16px 14px !important;
            border: 1px solid rgba(255, 122, 0, 0.3) !important;
            overflow: hidden;
            box-shadow: 0 4px 16px rgba(0,0,0,0.2);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .progress-bar {
            font-size: 11px !important;
            font-weight: 700 !important;
            text-shadow: 0 1px 3px rgba(0,0,0,0.4);
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .progress-bar.bg-success {
            background: linear-gradient(90deg, #1749d8 0%, #0f3a9d 100%) !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .progress-bar.bg-danger {
            background: linear-gradient(90deg, #ff7a00 0%, #ff9933 100%) !important;
        }

        /* ===== SECCIÓN DE INFORMACIÓN ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item {
            padding: 14px 16px !important;
            margin: 10px 10px !important;
            border: none !important;
            border-left: 4px solid #ff7a00 !important;
            border-radius: 6px !important;
            background: rgba(255, 255, 255, 0.08) !important;
            font-size: 11px;
            line-height: 1.7;
            transition: all 0.3s ease;
            color: white;
            backdrop-filter: blur(10px);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item:hover {
            background: rgba(255, 255, 255, 0.12) !important;
            border-left-color: #ffaa33;
            transform: translateX(4px);
            box-shadow: 0 4px 12px rgba(255, 122, 0, 0.2);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item p {
            margin: 5px 0 !important;
            font-size: 11px;
            color: rgba(255, 255, 255, 0.9);
            word-break: break-word;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .list-group-item b {
            color: rgba(255, 255, 255, 0.95) !important;
            font-weight: 700;
            font-size: 11px;
        }

        /* ===== ETA BOX ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #eta {
            margin: 12px 10px !important;
            padding: 14px 16px !important;
            background: linear-gradient(135deg, rgba(255, 122, 0, 0.2), rgba(255, 122, 0, 0.1)) !important;
            border-left: 4px solid #ff7a00 !important;
            border-radius: 6px !important;
            font-size: 11px !important;
            border: 1px solid rgba(255, 122, 0, 0.4) !important;
            box-shadow: 0 4px 12px rgba(255, 122, 0, 0.1);
            color: rgba(255, 255, 255, 0.9);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #eta b {
            color: #ffaa33;
            font-weight: 700;
            font-size: 11px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #eta span {
            color: #ff7a00;
            font-weight: 700;
            font-size: 11px;
        }

        /* ===== ICONOS ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .fa-truck,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .fa-warehouse {
            color: #ff7a00;
            font-size: 20px;
            transition: all 0.3s ease;
            text-shadow: 0 2px 4px rgba(0,0,0,0.2);
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .fa-truck:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .fa-warehouse:hover {
            color: #ffaa33;
            transform: scale(1.15);
        }

        /* ===== MAPA DERECHA ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #map {
            border-radius: 12px !important;
            border: 3px solid #ff7a00 !important;
            box-shadow: 0 10px 40px rgba(23, 73, 216, 0.2) !important;
            height: 100% !important;
            width: 100% !important;
            background: white !important;
        }

        /* ===== RESPONSIVE ===== */
        @media (max-width: 1400px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .row[style*="height: 100%"] {
                grid-template-columns: 320px 1fr;
            }
        }

        @media (max-width: 1100px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .row[style*="height: 100%"] {
                grid-template-columns: 1fr;
                height: auto;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas {
                height: auto;
                max-height: 45vh;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #map {
                height: 55vh;
                min-height: 400px;
            }
        }

        @media (max-width: 768px) {
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .row[style*="height: 100%"] {
                padding: 12px;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas {
                max-height: 40vh;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #map {
                height: 60vh;
            }
        }

        /* ===== UTILIDADES ===== */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) .color-panel {
            padding: 0 !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) sub {
            font-size: 11px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #map {
            flex: 1;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-mapaTracking-0"])) #panel-cargas {
            flex: 1;
        }

/* templates/vi/precios/precios.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-precios-0"])) .chart-12 {
            display: inline-block;
            vertical-align: middle;
            margin-left: 5px; /* separa un poco el texto del gráfico */
            width: 200px;
            height: 50px;
        }
        /* Regla para alinear números a la izquierda */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-precios-0"])) table.dataTable th.dt-type-numeric,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-precios-0"])) table.dataTable th.dt-type-date,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-precios-0"])) table.dataTable td.dt-type-numeric,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-precios-0"])) table.dataTable td.dt-type-date {
            text-align: left;
        }

/* templates/vi/precios/preciosEje.html.twig — bloque 1 */
/* Ajustes para el gauge y gráfico */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) #gaugeDiv,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) #gaugeDivKm {
            width: 100%;
            height: 400px;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) #chartHistorico,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) #chartHistoricoKm {
            width: 100%;
            height: 400px;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) .card-header {
            font-weight: bold;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-preciosEje-0"])) .card-body .value {
            float: right;
            font-weight: bold;
            text-align: right;
        }

/* templates/vi/precios.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-0"])) .chart-12 {
            display: inline-block;
            vertical-align: middle;
            margin-left: 5px; /* separa un poco el texto del gráfico */
            width: 200px;
            height: 50px;
        }
        /* Regla para alinear números a la izquierda */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-0"])) table.dataTable th.dt-type-numeric,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-0"])) table.dataTable th.dt-type-date,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-0"])) table.dataTable td.dt-type-numeric,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-precios-0"])) table.dataTable td.dt-type-date {
            text-align: left;
        }

/* templates/vi/Tender/vistaListadoOfertasTender.html.twig — bloque 1 */
/*
         * Colores y geometría de botones centralizados en
         * vi/botonesCompartidos.html.twig.
         */

/* templates/vi/vistaListadoClientes.html.twig — bloque 1 */
/*
         * Variante azul con la misma estructura visual que ecl-btn.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--blue {
            background-color: var(--ecl-blue-700, #0b3a82) !important;
            border-color: var(--ecl-blue-700, #0b3a82) !important;
            color: #ffffff !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--blue:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--blue:focus {
            background-color: var(--ecl-blue-800, #082d66) !important;
            border-color: var(--ecl-blue-800, #082d66) !important;
            color: #ffffff !important;
        }

        /*
         * Tercera variante para las acciones de la tabla.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--green {
            background-color: #198754 !important;
            border-color: #198754 !important;
            color: #ffffff !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--green:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-btn--green:focus {
            background-color: #146c43 !important;
            border-color: #146c43 !important;
            color: #ffffff !important;
        }

        /*
         * Mantiene juntos y centrados los dos botones superiores.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) .ecl-clientes-toolbar {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
        }

        /*
         * Los botones de acción de cada fila conservan el mismo tamaño
         * y separación aunque el fragmento AJAX utilice clases Bootstrap.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoClientes-0"])) #tabla-clientes tbody td:last-child .ecl-btn {
            margin: 0.2rem;
            white-space: nowrap;
        }

/* templates/vi/vistaListadoFacturas.html.twig — bloque 1 */
/* ==========================================================
           LISTADO DE FACTURAS
           Mismo ancho útil que vistaListadoOfertasCarga.html.twig
           ========================================================== */

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #myTabs,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .nav-tabs,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .tab-content,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .tab-pane {
            width: 100% !important;
            max-width: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #myTabs {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        /*
         * Los listados se reciben mediante AJAX y alguno puede traer
         * un container-custom propio. Se elimina aquí su límite del 80 %.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .container-custom {
            width: 100% !important;
            max-width: none !important;
            margin-right: 0 !important;
            margin-left: 0 !important;
            padding-right: 0 !important;
            padding-left: 0 !important;
        }

        /* El contenido cargado y DataTables deben aprovechar todo el ancho. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #tab-content1,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #tab-content2,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #facturas-emitidas,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page #facturas-recibidas,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .dataTables_wrapper,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .table-responsive {
            width: 100% !important;
            max-width: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page table.dataTable,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page table {
            width: 100% !important;
            max-width: none !important;
        }

        /* Evita que márgenes heredados vuelvan a centrar el fragmento AJAX. */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .mx-auto {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        /*
         * Conserva una separación uniforme entre botones de acción
         * cuando aparecen varios dentro de la misma celda.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page td .ecl-btn {
            margin: .2rem;
            white-space: nowrap;
        }

        /*
         * Los botones de descarga de factura llegan mediante AJAX con una
         * tipografía propia. Se iguala únicamente su texto al resto de
         * botones ECL, sin modificar color, tamaño, iconos ni estructura.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-font,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-font
            *:not(i):not(svg):not(path):not(circle) {
            font-family: inherit !important;
            font-size: .86rem !important;
            font-style: normal !important;
            font-weight: 700 !important;
            line-height: 1.25 !important;
            letter-spacing: .2px !important;
            text-transform: none !important;
        }

        /*
         * El icono anterior dependía de una fuente privada y podía mostrarse
         * como un cuadrado. Se sustituye por Font Awesome sólido.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-ready {
            position: relative !important;
            padding-left: 42px !important;
            text-align: center !important;
            background-image: none !important;
            filter: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-ready::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-ready::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page
            .ecl-invoice-download-ready
            *:not(.ecl-invoice-download-icon)::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page
            .ecl-invoice-download-ready
            *:not(.ecl-invoice-download-icon)::after {
            content: none !important;
            display: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoFacturas-0"])) .ecl-invoices-page .ecl-invoice-download-icon {
            position: absolute !important;
            top: 50% !important;
            left: 16px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: auto !important;
            height: auto !important;
            margin: 0 !important;
            padding: 0 !important;
            color: currentColor !important;
            font-size: 1rem !important;
            font-style: normal !important;
            line-height: 1 !important;
            transform: translateY(-50%) !important;
            pointer-events: none !important;
            opacity: 1 !important;
            filter: none !important;
        }

/* templates/vi/vistaListadoOfertasCarga.html.twig — bloque 1 */
/*
         * Normalización exclusiva de acciones dentro de las tablas de Cargas.
         * Los botones superiores continúan usando directamente las clases
         * compartidas de vi/botonesCompartidos.html.twig.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: normal !important;
            word-break: normal !important;
            overflow-wrap: normal !important;
            hyphens: none !important;
        }

        /*
         * Los iconos de acción se normalizan con Font Awesome sólido. El espacio con
         * el texto lo aporta gap, sin reescribir el contenido del botón.
         */
        /*
         * Se fuerza el texto blanco también en elementos internos, ya que
         * algunos fragmentos AJAX traen colores propios en spans o divs.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn * {
            color: #ffffff !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn i,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn svg,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn [class*="fa-"],
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn [class*="ti-"],
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn [class*="bi-"],
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-btn [class*="icon-"] {
            flex: 0 0 auto !important;
            margin: 0 !important;
            color: inherit !important;
            fill: currentColor;
        }

        /*
         * Icono Font Awesome usado en OC cliente y descargas de facturas.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-icon {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            flex: 0 0 auto !important;
            width: auto !important;
            height: auto !important;
            margin: 0 .1rem 0 0 !important;
            padding: 0 !important;
            color: currentColor !important;
            font-size: 1rem !important;
            font-style: normal !important;
            line-height: 1 !important;
            opacity: 1 !important;
            filter: none !important;
        }

        /*
         * Los fragmentos antiguos pueden dibujar el icono mediante
         * pseudoelementos. Se desactivan para evitar el cuadrado adicional.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-download::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-download::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-download *:not(.cargas-action-icon)::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-download *:not(.cargas-action-icon)::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-no-icon::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-no-icon::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-no-icon *::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .cargas-action-no-icon *::after {
            display: none !important;
            content: none !important;
        }

        /*
         * No se permite que un botón largo imponga un ancho mínimo a la
         * columna. Puede partir en espacios normales, pero nunca letra a letra.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs td .cargas-action-btn {
            max-width: 100% !important;
            hyphens: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs td,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs td * {
            word-break: normal !important;
            overflow-wrap: normal !important;
        }

        /*
         * Si la tabla necesita más espacio, se desplaza horizontalmente en
         * lugar de estrechar las columnas hasta deformar sus contenidos.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .table-responsive,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-0"])) #myTabs .dataTables_wrapper {
            max-width: 100%;
            overflow-x: auto;
        }

/* templates/vi/vistaListadoTransportistas.html.twig — bloque 1 */
/*
         * Ajuste exclusivo de los controles Gestionar de esta vista.
         * Utilizan el mismo azul visible que las acciones azules de Cargas.
         * Listado de cargas conserva su estructura y recibe solamente
         * la variante verde compartida.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .transportistas-manage-btn {
            display: inline-flex !important;
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
            justify-content: center !important;
            gap: .55rem !important;
            width: auto !important;
            min-width: 145px !important;
            min-height: 43px !important;
            height: auto !important;
            margin: .2rem !important;
            padding: 10px 22px !important;
            border-radius: 10px !important;
            font-family: inherit !important;
            font-size: .86rem !important;
            font-style: normal !important;
            font-weight: 700 !important;
            line-height: 1 !important;
            letter-spacing: .2px !important;
            text-transform: none !important;
            text-decoration: none !important;
            white-space: nowrap !important;
            opacity: 1 !important;
            filter: none !important;
            overflow: visible !important;
            cursor: pointer !important;
        }

        /*
         * Se eliminan pseudoelementos antiguos que generaban cuadrados.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .transportistas-manage-btn::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .transportistas-manage-btn::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas
        .transportistas-manage-btn
        *:not(.transportistas-manage-icon)::before,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas
        .transportistas-manage-btn
        *:not(.transportistas-manage-icon)::after {
            display: none !important;
            content: none !important;
        }

        /*
         * El elemento interior conserva su enlace o evento, pero deja
         * de dibujar un segundo botón dentro del contenedor exterior.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas
        .transportistas-manage-btn
        > :not(.transportistas-manage-icon) {
            display: inline-flex !important;
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
            justify-content: center !important;
            width: auto !important;
            min-width: 0 !important;
            min-height: 0 !important;
            height: auto !important;
            margin: 0 !important;
            padding: 0 !important;
            border: 0 !important;
            border-radius: 0 !important;
            background: transparent !important;
            background-color: transparent !important;
            color: inherit !important;
            font-family: inherit !important;
            font-size: inherit !important;
            font-style: normal !important;
            font-weight: inherit !important;
            line-height: inherit !important;
            letter-spacing: inherit !important;
            text-transform: none !important;
            text-decoration: none !important;
            box-shadow: none !important;
            opacity: 1 !important;
            filter: none !important;
            transform: none !important;
            white-space: nowrap !important;
        }

        /*
         * El texto se separa del HTML antiguo y utiliza exactamente la
         * tipografía y capitalización del botón compartido.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .transportistas-manage-label {
            display: inline-block !important;
            margin: 0 !important;
            padding: 0 !important;
            color: #ffffff !important;
            font-family: inherit !important;
            font-size: .86rem !important;
            font-style: normal !important;
            font-weight: 700 !important;
            line-height: 1 !important;
            letter-spacing: .2px !important;
            text-transform: none !important;
            flex: 0 0 auto !important;
            white-space: nowrap !important;
        }

        /*
         * Algunas reglas del fragmento AJAX aplican color y tipografía a
         * elementos interiores. Se refuerza aquí exclusivamente el texto de
         * Gestionar para que coincida con el resto de botones ECL.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas td .transportistas-manage-btn,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas td
        .transportistas-manage-btn
        *:not(.transportistas-manage-icon)
        :not(svg):not(path):not(circle) {
            color: #ffffff !important;
            font-family: inherit !important;
            font-size: .86rem !important;
            font-style: normal !important;
            font-weight: 700 !important;
            line-height: 1 !important;
            letter-spacing: .2px !important;
            text-transform: none !important;
            text-decoration: none !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .transportistas-manage-icon {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            flex: 0 0 auto !important;
            width: auto !important;
            height: auto !important;
            margin: 0 .55rem 0 0 !important;
            padding: 0 !important;
            color: currentColor !important;
            font-size: 1rem !important;
            font-style: normal !important;
            line-height: 1 !important;
            opacity: 1 !important;
            filter: none !important;
        }

        /*
         * Refuerzo final frente a reglas antiguas que colocaban el icono
         * encima del texto.
         */
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas td .transportistas-manage-btn,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas td
        .transportistas-manage-btn
        > :not(.transportistas-manage-icon) {
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas td
        .transportistas-manage-btn
        .transportistas-manage-icon {
            margin-right: .55rem !important;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoTransportistas-0"])) #myTabsTransportistas .table-responsive {
            overflow-x: auto !important;
        }

/* templates/baseVistasInternas.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-0"])) .form-control {
                height: 35px !important;
                border-radius: 4px !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-0"])) label {
                margin-bottom: 0rem;
            }
            /*            NUEVO 02/02/2024*/
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-0"])) .site-navbar {
                position: relative;
            }

            /*            ALINEAR ELMENTOS DE LOS DATATABLES ARRIBA*/
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-0"])) table.dataTable tbody td {
                vertical-align: top;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-0"])) .container-custom {
                width: 80%; /* O cualquier otro valor que desees */
                margin: 0 auto; /* Centrar el contenedor */
                padding-left: 15px; /* Agregar padding izquierdo según el grid */
                padding-right: 15px; /* Agregar padding derecho según el grid */
            }

/* templates/baseVistasInternas.html.twig — bloque 2 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])):root {
                --ecl-blue-900:#06133a;
                --ecl-blue-700:#0b2a6b;
                --ecl-blue-500:#1749d8;
                --ecl-blue-300:#5b8cff;
                --ecl-orange-500:#ff7a00;
                --ecl-orange-600:#e25a00;
                --ecl-ink:#1f2740;
                --ecl-mute:#5a647d;
                --ecl-bg:#eef3ff;
                --ecl-line:#e4e8f1;
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) body {
                font-family:'Poppins',sans-serif;
                color:var(--ecl-ink);
                background:var(--ecl-bg);
            }

            /* ---------- NAVBAR INTERNO (compacto y oscuro) ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar {
                background:var(--ecl-blue-900) !important;
                box-shadow:0 2px 12px -4px rgba(6,19,58,.5);
                border-bottom:3px solid var(--ecl-orange-500);
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-logo img {
                filter:brightness(0) invert(1); /*max-height:36px; width:auto;*/
            }

            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li > a.nav-link {
                color:rgba(255,255,255,.82) !important;
                font-weight:600;
                font-size:.86rem;
                padding:8px 11px !important;
                border-radius:7px;
                transition:background .15s ease, color .15s ease;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li > a.nav-link:hover {
                color:#fff !important;
                background:rgba(255,255,255,.1);
            }
            /* Item activo (lo marca main.js con .active en el <li>) */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li.active > a.nav-link {
                color:#fff !important;
                background:var(--ecl-blue-500);
            }
            /* LOGOUT destacado en naranja */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li > a.nav-link[href*="logout"] {
                background:var(--ecl-orange-500);
                color:#fff !important;
                font-weight:700;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li > a.nav-link[href*="logout"]:hover {
                background:var(--ecl-orange-600);
            }

            /* OJO: el script hace $('.site-menu > li > a').css('color','black') al cargar.
               Forzamos blanco por encima de ese inline para que el navbar oscuro sea legible. */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-navbar .site-menu > li > a {
                color:#fff !important;
            }


            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-menu-toggle .icon-menu {
                color:#fff;
            }

            /* ---------- MENÚ MÓVIL ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-mobile-menu {
                background:var(--ecl-blue-900);
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-mobile-menu .site-nav-wrap a {
                color:rgba(255,255,255,.85) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-mobile-menu .site-nav-wrap a:hover {
                color:var(--ecl-orange-500) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-mobile-menu .site-mobile-menu-close span {
                color:#fff;
            }

            /* ---------- CONTENIDO ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) #contenedor_principal {
                padding-top:18px;
            }

            /* ---------- DATATABLES (limpio y denso) ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) table.dataTable thead th {
                background:var(--ecl-blue-900);
                color:#fff;
                border:0 !important;
                font-weight:600;
                font-size:.82rem;
                text-transform:uppercase;
                letter-spacing:.3px;
                padding:10px 10px;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) table.dataTable tbody td {
                font-size:.86rem;
                border-color:var(--ecl-line) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) table.dataTable tbody tr:hover {
                background:#eef3ff !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) table.dataTable.stripe tbody tr.odd,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) table.dataTable.display tbody tr.odd {
                background:#fafbfe;
            }

            /* Controles de DataTables (buscador, paginación, length) */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .dataTables_wrapper .dataTables_filter input,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .dataTables_wrapper .dataTables_length select {
                border:1px solid var(--ecl-line);
                border-radius:7px;
                padding:5px 9px;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .dataTables_wrapper .dataTables_paginate .paginate_button.current {
                background:var(--ecl-blue-500) !important;
                border-color:var(--ecl-blue-500) !important;
                color:#fff !important;
                border-radius:7px;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
                background:var(--ecl-blue-700) !important;
                border-color:var(--ecl-blue-700) !important;
                color:#fff !important;
                border-radius:7px;
            }
            /* No tocamos la fila roja #ffcbcb que marca el JS: se respeta tal cual */

            /* ---------- BOTONES (paleta corporativa) ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .btn-primary {
                background:var(--ecl-blue-500) !important;
                border-color:var(--ecl-blue-500) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .btn-primary:hover {
                background:var(--ecl-blue-700) !important;
                border-color:var(--ecl-blue-700) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .btn-warning {
                background:var(--ecl-orange-500) !important;
                border-color:var(--ecl-orange-500) !important;
                color:#fff !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .btn-warning:hover {
                background:var(--ecl-orange-600) !important;
                border-color:var(--ecl-orange-600) !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .btn {
                border-radius:8px;
                font-weight:600;
            }

            /* ---------- TABS / LIST-GROUP (usado en listados) ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .nav-tabs .nav-link.active {
                color:var(--ecl-blue-500);
                border-color:var(--ecl-line) var(--ecl-line) #fff;
                font-weight:700;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .nav-tabs .nav-link:hover {
                border-color:var(--ecl-line);
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .list-group-item.active {
                background:var(--ecl-blue-500);
                border-color:var(--ecl-blue-500);
            }

            /* ---------- MODALES ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .modal-content {
                overflow:hidden;
}


            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) #confirm-button.btn-success {
                background: #147b57 !important;
                border-color: #147b57 !important;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) #confirm-button.btn-success:hover {
                background: #147b57 !important;
                border-color: #147b57 !important;
            }

            /* ---------- WHATSAPP FLOTANTE ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) a.whatsapp {
                position:fixed;
                right:20px;
                bottom:20px;
                z-index:9998;
                width:52px;
                height:52px;
                border-radius:50%;
                background:#25D366;
                color:#fff !important;
                display:grid;
                place-items:center;
                font-size:1.5rem;
                box-shadow:0 10px 24px -8px rgba(37,211,102,.7);
                transition:transform .18s ease;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) a.whatsapp:hover {
                transform:scale(1.08);
            }

            /* ---------- FLASH ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) #div_flash.alert {
                border-radius:10px;
                border:0;
                font-weight:600;
                box-shadow:0 18px 40px -18px rgba(0,0,0,.45);
            }

            /* ---------- FOOTER ---------- */
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer {
                background:var(--ecl-blue-900) !important;
                color:rgba(255,255,255,.72);
                position:relative;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer::before {
                content:"";
                position:absolute;
                top:0;
                left:0;
                right:0;
                height:3px;
                background:var(--ecl-orange-500);
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer img {
                filter:brightness(0) invert(1); /*max-height:48px; width:auto;*/
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer .footer-heading {
                color:#fff;
                font-weight:700;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer a {
                color:rgba(255,255,255,.7);
                transition:color .15s ease;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer a:hover {
                color:var(--ecl-orange-500);
                text-decoration:none;
            }
            :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-1"])) .site-footer .border-top {
                border-color:rgba(255,255,255,.12) !important;
            }

/* Componentes de botones compartidos por las vistas internas. */

/* templates/vi/botonesCompartidos.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: .45rem;
        min-height: 43px !important;
        padding: 10px 22px !important;
        border: 1px solid transparent !important;
        border-radius: 10px !important;
        background-image: none !important;
        filter: none !important;
        font-family: inherit;
        font-size: .86rem !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .2px;
        text-align: center;
        text-decoration: none !important;
        white-space: nowrap;
        vertical-align: middle;
        cursor: pointer;
        transition: transform .18s ease,
                    box-shadow .18s ease,
                    background-color .18s ease,
                    border-color .18s ease,
                    color .18s ease,
                    filter .18s ease;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) table .ecl-btn,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .dataTables_wrapper .ecl-btn {
        min-height: 43px !important;
        padding: 10px 22px !important;
        border-radius: 10px !important;
        font-size: .86rem !important;
        line-height: 1 !important;
        margin: .2rem !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn:focus {
        transform: translateY(-2px) !important;
        box-shadow: 0 10px 20px -12px rgba(6, 19, 58, .65) !important;
        background-image: none !important;
        filter: none !important;
        text-decoration: none !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn:active {
        transform: translateY(0) !important;
        box-shadow: none !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn:focus-visible {
        outline: 3px solid rgba(23, 73, 216, .28);
        outline-offset: 2px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn:disabled,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn.disabled,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn[aria-disabled="true"] {
        opacity: .58;
        pointer-events: none;
        transform: none !important;
        box-shadow: none !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--orange {
        background: #ff7a00 !important;
        background-image: none !important;
        border-color: #ff7a00 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--orange:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--orange:focus {
        background: #e25a00 !important;
        background-image: none !important;
        border-color: #e25a00 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--blue {
        background: #1557d6 !important;
        background-image: none !important;
        border-color: #1557d6 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--blue:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--blue:focus {
        background: #1048b8 !important;
        background-image: none !important;
        border-color: #1048b8 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--green {
        background: #198754 !important;
        background-image: none !important;
        border-color: #198754 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--green:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--green:focus {
        background: #146c43 !important;
        background-image: none !important;
        border-color: #146c43 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--red {
        background: #dc3545 !important;
        background-image: none !important;
        border-color: #dc3545 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--red:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--red:focus {
        background: #b02a37 !important;
        background-image: none !important;
        border-color: #b02a37 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--gray {
        background: #6c757d !important;
        background-image: none !important;
        border-color: #6c757d !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--gray:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--gray:focus {
        background: #565e64 !important;
        background-image: none !important;
        border-color: #565e64 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--cyan {
        background: #17a2b8 !important;
        background-image: none !important;
        border-color: #17a2b8 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--cyan:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--cyan:focus {
        background: #117a8b !important;
        background-image: none !important;
        border-color: #117a8b !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--dark {
        background: #343a40 !important;
        background-image: none !important;
        border-color: #343a40 !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--dark:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--dark:focus {
        background: #23272b !important;
        background-image: none !important;
        border-color: #23272b !important;
        color: #ffffff !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--custom {
        background: var(--ecl-btn-custom-bg) !important;
        background-image: none !important;
        border-color: var(--ecl-btn-custom-border, var(--ecl-btn-custom-bg)) !important;
        color: var(--ecl-btn-custom-color, #ffffff) !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--custom:hover,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-btn--custom:focus {
        background: color-mix(
            in srgb,
            var(--ecl-btn-custom-bg) 88%,
            #000000
        ) !important;
        background-image: none !important;
        border-color: color-mix(
            in srgb,
            var(--ecl-btn-custom-border, var(--ecl-btn-custom-bg)) 88%,
            #000000
        ) !important;
        filter: none !important;
        color: var(--ecl-btn-custom-color, #ffffff) !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-toolbar {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex-wrap: wrap;
        margin-top: 3rem;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-toolbar--center {
        justify-content: center;
        width: 100%;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-botonesCompartidos-0"])) .ecl-actions {
        display: flex;
        align-items: center;
        gap: .4rem;
        flex-wrap: wrap;
    }

/* templates/baseVistasInternas.html.twig — bloque 4 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) .modal {
                            z-index: 2000 !important;
                            text-align: center;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) .modal-dialog {
                            width: calc(100% - 48px);
                            max-width: 1040px;
                            display: block;
                            margin: 24px auto;
                            text-align: left;
                        }


                        /* ==========================================================
               MODAL GRANDE PARA LOS DETALLES DE LA OFERTA DE CARGA
               ========================================================== */

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .modal-dialog {
                            display: block !important;

                            width: 92vw !important;
                            max-width: 1500px !important;

                            margin: 18px auto !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .modal-content {
                            width: 100% !important;
                            max-width: none !important;

                            max-height: calc(100vh - 36px) !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .modal-body {
                            padding: 20px !important;
                        }

                        /* Título superior de la modal */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .modal-title {
                            font-size: 20px !important;
                        }

                        /* Contenedor general de los detalles */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro {
                            padding: 20px !important;
                            font-size: 15px !important;
                        }

                        /* Separación entre secciones */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-sec {
                            margin-bottom: 22px !important;
                        }

                        /* Títulos: datos transportista, detalles del trabajo, puntos... */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-title {
                            font-size: 14px !important;

                            margin-bottom: 15px !important;
                            padding-bottom: 9px !important;
                        }

                        /* Etiquetas: empresa, teléfono, precio, ciudad... */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-label {
                            font-size: 11px !important;
                            margin-bottom: 6px !important;
                        }

                        /* Valores normales */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-value {
                            font-size: 14px !important;
                            line-height: 1.5 !important;
                        }

                        /* Precios y valores destacados */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-value.big {
                            font-size: 18px !important;
                        }

                        /* Etiquetas de requisitos: GPS, ADR, cinchas... */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-badge {
                            padding: 5px 11px !important;
                            font-size: 11px !important;
                        }

                        /* Tablas de cargas y descargas */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-table {
                            font-size: 13px !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-table th {
                            padding: 10px !important;
                            font-size: 11px !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-table td {
                            padding: 10px !important;
                            font-size: 13px !important;
                            line-height: 1.4 !important;
                        }

                        /* Más espacio entre los elementos superiores */
                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal.modal-detalle-carga-grande .ecl-ro-grid {
                            gap: 18px !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) .modal-content {
                            max-height: calc(100vh - 3.5rem);
                            overflow-y: auto;
                            width: 100%;
                            max-width: 100%;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal2 .modal-dialog {
                            min-width: 95vw !important;
                            margin: 1.75rem auto !important;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal2 .modal-content {
                            height: 90vh !important;
                            border-radius: 12px;
                        }

                        :where(html:has(body.centrum-internal):has(template[data-centrum-style="baseVistasInternas-3"])) #myModal2 .modal-body {
                            height: calc(90vh - 130px);
                            padding: 0;
                        }

/* templates/vi/calendario.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .legend-item {
            display: flex;
            align-items: center;
            margin-bottom: 8px;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .legend-color {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            display: inline-block;
            margin-right: 8px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .color-por-vender-sin-retraso {
            background-color: #bfcde6;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .color-por-vender-con-retraso {
            background-color: #ef9a9a;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .color-vendida-sin-cargar-descargar {
            background-color: #ff9800;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .color-vendida-solo-cargada {
            background-color: #9ccc65;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-calendario-0"])) .color-vendida-cargada-descargada {
            background-color: #ffff8d;
        }

/* templates/vi/crearCliente.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-crearCliente-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-crearCliente-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/detalleTrayecto.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-header {
        flex: 0 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 12px;
        background: #06133a;
        color: white;
        border-bottom: 3px solid #ff7a00;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-title {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
        margin: 0;
        font-size: 13px;
        font-weight: 700;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-stats {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        font-size: 11px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-stat {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-stat-label {
        font-size: 8px;
        opacity: 0.9;
        text-transform: uppercase;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-stat-value {
        font-size: 12px;
        font-weight: 700;
    }

    /* Evita que padding y bordes aumenten el tamaño */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-section,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-section * {
        box-sizing: border-box;
    }

    /*
     * Ocupa todo el espacio que reciba desde
     * #myModal2 .modal-body.
     */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-section {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        min-width: 0;
        min-height: 0;
        padding: 0;
        overflow: hidden;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-container {
        flex: 1 1 auto;
        display: grid;

        /*
         * El primer elemento es el mapa y el segundo el panel.
         * Por eso el mapa recibe la columna más grande.
         */
        grid-template-columns:
            minmax(0, 3fr)
            minmax(280px, 1fr);

        width: 100%;
        height: 100%;
        min-width: 0;
        min-height: 0;
        gap: 12px;
        padding: 12px;
        overflow: hidden;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) #map-detalle-trayecto {
        width: 100%;
        height: 100%;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        border-radius: 4px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar {
        width: 100% !important;
        height: 100% !important;
        min-width: 0;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border-radius: 4px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar::-webkit-scrollbar {
        width: 4px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 2px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar::-webkit-scrollbar-thumb {
        background: #1749d8;
        border-radius: 2px;
    }

    /* Impide que las indicaciones ensanchen la modal */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar table,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-directions {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 11px !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar img {
        max-width: 100%;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-listheader,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-summary {
        color: #06133a !important;
        font-weight: 600 !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-listsel,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-listsel b {
        font-weight: 600 !important;
        background-color: #e3f2fd !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-directions tbody tr:nth-child(even) {
        background-color: #f9f9f9;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-directions tbody tr:nth-child(odd) {
        background-color: white;
    }

    /* Tablet */
    @media (max-width: 1024px) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-container {
            grid-template-columns:
                minmax(0, 2fr)
                minmax(240px, 1fr);
            gap: 8px;
            padding: 8px;
        }
    }

    /* Móvil vertical: mapa arriba y recorrido abajo */
    @media (max-width: 767.98px) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-container {
            grid-template-columns: minmax(0, 1fr);
            grid-template-rows:
                minmax(220px, 60%)
                minmax(150px, 40%);
            gap: 6px;
            padding: 6px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-sidebar table,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .adp-directions {
            font-size: 10px !important;
        }
    }

    /* Móvil horizontal o dispositivo con poca altura */
    @media (max-height: 550px) and (orientation: landscape) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-container {
            grid-template-columns:
                minmax(0, 1.7fr)
                minmax(210px, 1fr);
            grid-template-rows: minmax(0, 1fr);
        }
    }

    /* Móviles especialmente estrechos */
    @media (max-width: 380px) and (orientation: portrait) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-detalleTrayecto-0"])) .ecl-route-container {
            grid-template-rows:
                minmax(200px, 55%)
                minmax(140px, 45%);
        }
    }

/* templates/vi/formularioModificarMatriculas.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioModificarMatriculas-0"])) .dropdown-toggle {
        background-color: inherit;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioModificarMatriculas-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioModificarMatriculas-0"])) body > .dropdown-menu.show {
        z-index: 99999 !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioModificarMatriculas-0"])) .bootstrap-select .dropdown-menu {
        z-index: 99999 !important;
    }

/* templates/vi/formularioVehiculo.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioVehiculo-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-formularioVehiculo-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/listadoClientes.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoClientes-0"])) i {
        margin:5px;
    }

/* templates/vi/listadoCoincidenciasAdmin.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoCoincidenciasAdmin-0"])) i {
        margin:5px;
    }

/* templates/vi/listadoCoincidenciasTransportista.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoCoincidenciasTransportista-0"])) i {
        margin: 5px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoCoincidenciasTransportista-0"])) .dt-column-title {
        color: white;
    }

/* templates/vi/listadoOfertasVehiculo.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-listadoOfertasVehiculo-0"])) i {
        margin:5px;
    }

/* templates/vi/modalCalculoCotizacion.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCalculoCotizacion-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCalculoCotizacion-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCalculoCotizacion-0"])) .pac-container {
        z-index: 10000;
    }

/* templates/vi/modalCambiarCliente.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCambiarCliente-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCambiarCliente-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/modalCmr.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) body {
        background: #f0f2f5 !important;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    }

    /* ===== CONTAINER PRINCIPAL ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .container.row {
        background: transparent !important;
        padding: 20px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .col-md-12 {
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 40px rgba(6, 19, 58, 0.15);
        padding: 24px !important;
    }

    /* ===== TÍTULOS SECCIONES ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .title {
        padding-bottom: 12px;
        border-bottom: 3px solid #ff7a00;
        margin-bottom: 18px !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .title h5 {
        font-size: 16px;
        font-weight: 700;
        color: #06133a;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .title .text-primary {
        color: #1749d8 !important;
    }

    /* ===== TABLAS ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table-responsive {
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
        margin-bottom: 20px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table {
        margin-bottom: 0;
        font-size: 12px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table thead tr {
        background: linear-gradient(135deg, #06133a 0%, #1749d8 100%) !important;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table thead th {
        color: white !important;
        font-weight: 700;
        border: none !important;
        padding: 14px !important;
        text-transform: uppercase;
        font-size: 11px;
        letter-spacing: 0.5px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table tbody td {
        border: 1px solid #e1e8ed !important;
        padding: 12px 14px !important;
        vertical-align: middle;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table tbody tr {
        transition: all 0.3s ease;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table tbody tr:hover {
        background: linear-gradient(90deg, #f0f7ff, #fff9f0) !important;
        box-shadow: 0 2px 8px rgba(23, 73, 216, 0.1);
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table tbody img {
        margin-right: 6px;
        border-radius: 2px;
    }

    /* ===== RADIO BUTTONS ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) input[type="radio"] {
        cursor: pointer;
        accent-color: #1749d8;
        width: 18px;
        height: 18px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-check-label {
        margin: 0;
        cursor: pointer;
    }

    /* ===== FORMULARIO ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-row {
        display: flex;
        gap: 16px;
        margin-top: 20px;
        padding: 20px;
        background: linear-gradient(135deg, #f0f7ff 0%, #fff3e0 100%);
        border-radius: 8px;
        border-left: 4px solid #1749d8;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-group {
        flex: 1;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-group label {
        font-size: 11px;
        font-weight: 700;
        color: #06133a;
        margin-bottom: 6px;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-control {
        border: 2px solid #e1e8ed !important;
        border-radius: 6px;
        padding: 10px 12px !important;
        font-size: 12px;
        transition: all 0.3s ease;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-control:focus {
        border-color: #1749d8 !important;
        box-shadow: 0 0 0 3px rgba(23, 73, 216, 0.1) !important;
        outline: none;
    }

    /* ===== TABLA CUSTOM ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .tabla-custom {
        margin-bottom: 20px;
    }

    /* ===== SECCIONES ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) section {
        margin-bottom: 30px;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) section:last-of-type {
        margin-bottom: 0;
    }

    /* ===== BOTONES ===== */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .btn-primary {
        background: linear-gradient(135deg, #1749d8 0%, #0f3a9d 100%) !important;
        border: none !important;
        border-radius: 6px;
        padding: 10px 24px !important;
        font-weight: 700;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        transition: all 0.3s ease;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(23, 73, 216, 0.3);
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .btn-danger {
        background: linear-gradient(135deg, #ff7a00 0%, #e25a00 100%) !important;
        border: none !important;
        border-radius: 6px;
        padding: 8px 16px !important;
        font-weight: 700;
        font-size: 11px;
        transition: all 0.3s ease;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .btn-danger:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 122, 0, 0.3);
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 768px) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-row {
            flex-direction: column;
            gap: 12px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .form-group {
            width: 100%;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .table {
            font-size: 11px;
        }

        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalCmr-0"])) .col-md-12 {
            padding: 16px !important;
        }
    }

/* templates/vi/modalEmitirFacturaCliente.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalEmitirFacturaCliente-0"])) .modal:has(template[data-centrum-style="vi-modalEmitirFacturaCliente-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalEmitirFacturaCliente-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalEmitirFacturaCliente-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/modalMarcarFacturaClienteCobrada.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalMarcarFacturaClienteCobrada-0"])) .modal:has(template[data-centrum-style="vi-modalMarcarFacturaClienteCobrada-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }

/* templates/vi/modalMarcarFacturaExtraCobrada.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalMarcarFacturaExtraCobrada-0"])) .modal:has(template[data-centrum-style="vi-modalMarcarFacturaExtraCobrada-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }

/* templates/vi/modalMarcarFacturaExtraPagada.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalMarcarFacturaExtraPagada-0"])) .modal:has(template[data-centrum-style="vi-modalMarcarFacturaExtraPagada-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }

/* templates/vi/modalMarcarFacturaFactoringCobrada.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalMarcarFacturaFactoringCobrada-0"])) .modal:has(template[data-centrum-style="vi-modalMarcarFacturaFactoringCobrada-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }

/* templates/vi/modalMarcarFacturaTransportistaPagada.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalMarcarFacturaTransportistaPagada-0"])) .modal:has(template[data-centrum-style="vi-modalMarcarFacturaTransportistaPagada-0"]) > .modal-dialog {
        width: min(760px, calc(100% - 32px)) !important;
    }

/* templates/vi/modalOfertaCargaPunto.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalOfertaCargaPunto-0"])) .pac-container1 {
        top: 10px !important;
        left: 0 !important;
    }

/* templates/vi/modalPublicarVehiculo.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalPublicarVehiculo-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalPublicarVehiculo-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/modalPublicarVehiculo.html.twig — bloque 2 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalPublicarVehiculo-1"])) .pac-container {
        top: 65px !important;
        left: 0 !important;
    }

/* templates/vi/modalSolicitarInfoOfertaCarga.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-section {
        padding: 0;
        background: linear-gradient(135deg, #f5f8ff 0%, #fff9f0 100%);
        border-radius: 4px;
        overflow: hidden;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-header {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 14px;
        background: #06133a;
        border-bottom: 3px solid #ff7a00;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-icon {
        font-size: 20px;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-title {
        font-size: 13px;
        font-weight: 700;
        color: white;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-body {
        padding: 16px;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-field {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-label {
        font-size: 11px;
        font-weight: 600;
        color: #06133a;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-textarea {
        font-size: 11px;
        padding: 10px;
        border: 2px solid #e1e8ed;
        border-radius: 4px;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
        resize: vertical;
        min-height: 100px;
        line-height: 1.4;
        transition: border-color 0.3s ease;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-textarea:focus {
        outline: none;
        border-color: #1749d8;
        box-shadow: 0 0 0 3px rgba(23, 73, 216, 0.1);
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-char-counter {
        font-size: 8px;
        color: #999;
        text-align: right;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-footer {
        padding: 12px 16px;
        background: white;
        border-top: 1px solid #e1e8ed;
        display: flex;
        justify-content: center;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-btn {
        padding: 10px 24px;
        background: #1749d8;
        color: white;
        border: none;
        border-radius: 4px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        cursor: pointer;
        letter-spacing: 0.5px;
        transition: all 0.3s ease;
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-btn:hover:not(:disabled) {
        background: #0f3a9d;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(23, 73, 216, 0.3);
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-btn:active:not(:disabled) {
        transform: translateY(0);
    }
    
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-modalSolicitarInfoOfertaCarga-0"])) .ecl-solicitar-btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* templates/vi/publicarCarga.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl {
        --ecl-blue-900: #06133a;
        --ecl-blue-700: #0b2a6b;
        --ecl-blue-500: #1749d8;
        --ecl-blue-300: #5b8cff;
        --ecl-orange-500: #ff7a00;
        --ecl-orange-400: #ff9d2e;
        --ecl-orange-600: #e25a00;
        --ecl-ink: #06133a;
        --ecl-mute: #50617e;
        --ecl-bg: #eef3ff;
        --ecl-line: #e7ebf5;
        --ecl-radius: 18px;
        --ecl-grad-blue: linear-gradient(110deg,var(--ecl-blue-500),#245ce8);
        --ecl-grad-orange: linear-gradient(135deg, #ff9d2e 0%, #e25a00 100%);
        --ecl-shadow: 0 22px 50px -32px rgba(6, 19, 58, .45);
        --ecl-sidebar-w: 248px;
    }


    /* ---------- Layout full-width (sin .container que limite) ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page {
        width: 100%;
        padding: 28px clamp(16px, 4vw, 48px) 60px;
        background: var(--ecl-bg);
    }

    /* ---------- Banner / cabecera de vista ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-hero {
        background: var(--ecl-grad-blue);
        border-radius: 22px;
        padding: 38px 40px;
        color: #fff;
        position: relative;
        overflow: hidden;
        box-shadow: 0 28px 60px -32px rgba(6, 19, 58, .6);
        margin-bottom: 24px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-hero::after {
        content: "";
        position: absolute;
        top: -90px;
        right: -70px;
        width: 320px;
        height: 320px;
        border-radius: 50%;
        background: radial-gradient(circle at 30% 30%, rgba(255, 122, 0, .5), transparent 65%);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-hero .ecl-kick {
        font-size: .76rem;
        font-weight: 800;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        color: var(--ecl-orange-400);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-hero h1 {
        font-size: clamp(1.7rem, 3.5vw, 2.4rem);
        font-weight: 900;
        margin: 6px 0 0;
        letter-spacing: -.02em;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-hero-sub {
        margin: 10px 0 0;
        max-width: 620px;
        font-size: .98rem;
        line-height: 1.55;
        color: rgba(255,255,255,.82);
        position: relative;
        z-index: 1;
    }

    /* ---------- Cabecera ligera de página ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page-head {
        margin: 8px 0 22px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page-head h1 {
        font-size: clamp(1.4rem, 2.6vw, 1.9rem);
        font-weight: 900;
        color: var(--ecl-blue-900);
        margin: 0;
        position: relative;
        padding-bottom: 12px;
        display: inline-block;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page-head h1::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 60px;
        height: 4px;
        border-radius: 4px;
        background: var(--ecl-grad-orange);
    }

    /* ---------- Toolbar (botón de acción de página) ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-toolbar {
        display: flex;
        justify-content: flex-end;
        margin: 4px 0 22px;
    }
    @media (max-width: 575px) {
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-toolbar {
            justify-content: stretch;
        }
        :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-toolbar .ecl-btn {
            width: 100%;
        }
    }

    /* ---------- Tarjeta genérica ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-card {
        background: #fff;
        border: 1px solid var(--ecl-line);
        border-radius: var(--ecl-radius);
        padding: 28px;
        box-shadow: var(--ecl-shadow);
        margin-bottom: 24px;
    }

    /* ---------- Encabezado de sección dentro de tarjeta ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 14px;
        margin-bottom: 22px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head h2,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head h3 {
        margin: 0;
        font-weight: 900;
        color: var(--ecl-blue-900);
        position: relative;
        padding-bottom: 10px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head h2 {
        font-size: 1.5rem;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head h2::after,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-section-head h3::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 52px;
        height: 4px;
        border-radius: 4px;
        background: var(--ecl-grad-orange);
    }

    /* Encabezado de bloque con icono (formularios) */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-block-head {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 0 0 20px;
        padding-bottom: 14px;
        border-bottom: 1px solid #eef1f7;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-block-head .ic {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        flex: 0 0 auto;
        display: grid;
        place-items: center;
        color: #fff;
        font-size: 1rem;
        background: var(--ecl-grad-blue);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-block-head .ic.orange {
        background: var(--ecl-grad-orange);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-block-head h3 {
        margin: 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: var(--ecl-blue-900);
        padding: 0;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-block-head h3::after {
        display: none;
    }

    /* ---------- Divisor ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-divider {
        width: 100%;
        height: 4px;
        background-image: linear-gradient(to right, transparent, var(--ecl-blue-500), transparent);
        margin: 28px 0;
    }

    /* ---------- Inputs ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page label,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-card label {
        font-weight: 700;
        color: var(--ecl-ink);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page .form-control,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-card .form-control {
        border: 1.5px solid #e2e8f0 !important;
        border-radius: 11px !important;
        height: auto !important;
        padding: 10px 13px !important;
        font-size: 14px !important;
        transition: border-color .15s ease, box-shadow .15s ease;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page .form-control:focus,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-card .form-control:focus {
        border-color: var(--ecl-blue-500) !important;
        box-shadow: 0 0 0 4px rgba(23, 73, 216, .12) !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-page .form-control[type="file"] {
        padding: 8px !important;
    }

    /* Checkbox "copiar datos" como chip */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-chip {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: var(--ecl-bg);
        border: 1px solid #e2e8f0;
        border-radius: 999px;
        padding: 8px 16px;
        font-weight: 600;
        color: var(--ecl-ink);
        cursor: pointer;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-chip input {
        margin: 0;
    }

    /* ---------- Buscador ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-search {
        border: 1.5px solid #e2e8f0;
        border-radius: 12px;
        padding: 11px 16px;
        font-size: 14px;
        outline: none;
        min-width: 240px;
        background: #fff;
        transition: border-color .18s ease, box-shadow .18s ease;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-search:focus {
        border-color: var(--ecl-blue-500);
        box-shadow: 0 0 0 4px rgba(23, 73, 216, .12);
    }

    /* ---------- Botones ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        border: 0;
        cursor: pointer;
        text-decoration: none;
        font-weight: 700;
        font-size: 15px;
        padding: 12px 28px;
        border-radius: 12px;
        color: #fff;
        transition: transform .18s ease, filter .18s ease;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-btn:hover {
        transform: translateY(-2px);
        filter: brightness(1.06);
        text-decoration: none;
        color: #fff;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-btn--blue {
        background: var(--ecl-grad-blue);
        box-shadow: 0 14px 30px -14px rgba(23, 73, 216, .7);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-btn--orange {
        background: var(--ecl-grad-orange);
        box-shadow: 0 12px 26px -12px rgba(255, 122, 0, .7);
    }

    /* ---------- Botones-icono de acción (redondos) ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: inline-grid;
        place-items: center;
        cursor: pointer;
        border: 0;
        font-size: 14px;
        color: #fff;
        transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
        text-decoration: none;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act:hover {
        transform: translateY(-2px) scale(1.05);
        filter: brightness(1.05);
        color: #fff;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act + .ecl-act {
        margin-left: 6px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act--edit {
        background: var(--ecl-blue-500);
        box-shadow: 0 8px 18px -8px rgba(23,73,216,.7);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act--add {
        background: var(--ecl-blue-700);
        box-shadow: 0 8px 18px -8px rgba(11,42,107,.7);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act--delete {
        background: var(--ecl-orange-600);
        box-shadow: 0 8px 18px -8px rgba(226,90,0,.7);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act--view {
        background: var(--ecl-blue-300);
        box-shadow: 0 8px 18px -8px rgba(91,140,255,.7);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-act--neutral {
        background: #8a93a8;
    }

    /* ---------- Tablas (cuando se conserva tabla en vez de tarjetas) ---------- */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table {
        border-collapse: separate !important;
        border-spacing: 0 !important;
        width: 100% !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table thead,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table thead.bg-primary {
        background: var(--ecl-grad-blue) !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table thead th {
        background: transparent !important;
        color: #fff !important;
        border: 0 !important;
        font-weight: 700 !important;
        text-transform: uppercase;
        letter-spacing: .4px;
        font-size: .78rem !important;
        padding: 13px 14px !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table thead th:first-child {
        border-top-left-radius: 12px !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table thead th:last-child {
        border-top-right-radius: 12px !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table tbody td {
        padding: 12px 14px !important;
        border-bottom: 1px solid #eef1f7 !important;
        vertical-align: middle !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table tbody tr:nth-child(even) {
        background: #fafbfe !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .ecl-table tbody tr:hover {
        background: #eef3ff !important;
    }


    /* Adaptación al contenedor modal; se conserva la distribución Bootstrap original. */
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl.container.row {
        display:block;
        width:100%;
        max-width:none;
        margin:0;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl > .col-md-12 {
        padding:0;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl textarea {
        box-sizing:border-box;
        width:100%;
        max-width:100%;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl .ecl-btn--blue {
        background:var(--ecl-grad-blue);
        border:0;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl .ecl-btn--orange {
        background:var(--ecl-grad-orange);
        border:0;
        color:#fff;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl .title h2,
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl .title h3 {
        color:var(--ecl-blue-900) !important;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl #oc-datos-desplegable > summary {
        cursor:pointer;
        color:var(--ecl-blue-900);
        font-weight:800;
        padding-bottom:10px;
        border-bottom:3px solid var(--ecl-orange-500);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl #oc-datos-desplegable > summary:focus-visible {
        outline:2px solid var(--ecl-blue-500);
        outline-offset:4px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-0"])) .oc-oferta-ecl .oc-datos-contenido {
        padding-top:18px;
    }

/* templates/vi/publicarCarga.html.twig — bloque 2 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-1"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-1"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/publicarCarga.html.twig — bloque 3 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCarga-2"])) .pac-container {
        top: 65px !important;
        left: 0 !important;
    }

/* templates/vi/publicarCargaReadonly.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro {
        padding: 12px;
        font-size: 12px;
        background: linear-gradient(135deg, #f5f8ff 0%, #fff9f0 100%);
        border-radius: 4px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-sec {
        margin-bottom: 14px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-title {
        font-size: 11px;
        font-weight: 700;
        color: #1749d8;
        margin-bottom: 10px;
        padding-bottom: 6px;
        border-bottom: 2px solid #ff7a00;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-grid {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 10px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-grid.cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-grid.cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-grid.cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-grid.cols-1 {
        grid-template-columns: 1fr;
    }

    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-item {
        display: flex;
        flex-direction: column;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-label {
        font-size: 11px;
        font-weight: 600;
        color: #666;
        margin-bottom: 4px;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-value {
        font-size: 11px;
        color: #06133a;
        font-weight: 500;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-value.big {
        font-size: 13px;
        font-weight: 700;
        color: #1749d8;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-badges {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 4px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-badge {
        display: inline-block;
        padding: 3px 8px;
        background: #e3f2fd;
        border: 1px solid #1749d8;
        border-radius: 12px;
        font-size: 11px;
        color: #1749d8;
        font-weight: 600;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-badge.active {
        background: #1749d8;
        color: white;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 11px;
        margin-top: 8px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-table thead {
        background: #06133a;
        color: white;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-table th {
        padding: 6px;
        text-align: left;
        font-weight: 600;
        font-size: 11px;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-table td {
        padding: 6px;
        border-bottom: 1px solid #e1e8ed;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-table tbody tr:hover {
        background: #f5f5f5;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-row {
        display: flex;
        justify-content: space-between;
        padding: 6px 0;
        border-bottom: 1px solid #f0f0f0;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-publicarCargaReadonly-0"])) .ecl-ro-row:last-child {
        border-bottom: none;
    }

/* templates/vi/Tender/detallesOfertaTender.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-detallesOfertaTender-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-detallesOfertaTender-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/Tender/modalPublicarTender.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalPublicarTender-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalPublicarTender-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/Tender/modalTender1.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalTender1-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalTender1-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/Tender/modalTender3.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalTender3-0"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-Tender-modalTender3-0"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }

/* templates/vi/vistaListadoOfertasCarga.html.twig — bloque 2 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga-1"])) i {
                  margin: 5px;
              }

/* templates/vi/vistaListadoOfertasCarga_old.html.twig — bloque 1 */
:where(html:has(body.centrum-internal):has(template[data-centrum-style="vi-vistaListadoOfertasCarga_old-0"])) i {
                  margin: 5px;
              }


/* Modales internas: espacio útil, tipografía legible y formularios sin solapamientos. */
body.centrum-internal .modal:has(.oc-oferta-ecl) > .modal-dialog {
    width: calc(100% - 48px) !important;
    max-width: 1280px !important;
}
body.centrum-internal .modal:has(#confirm-button) > .modal-dialog {
    max-width: 480px;
}
body.centrum-internal .modal-body {
    container-type: inline-size;
    min-width: 0;
}
body.centrum-internal .modal .oc-oferta-ecl.container.row {
    padding: 0;
    background: transparent;
}
body.centrum-internal .modal .oc-oferta-ecl .ecl-card {
    border-radius: 12px;
    box-shadow: 0 8px 24px -18px rgba(6, 19, 58, .3);
}
body.centrum-internal .oc-oferta-ecl #detalles_trabajo > .title {
    margin: 4px 0 20px !important;
}
body.centrum-internal .oc-oferta-ecl .form-group {
    min-width: 0;
}
body.centrum-internal .oc-oferta-ecl .form-group > label {
    display: block;
    margin-bottom: 6px;
    line-height: 1.45;
    font-size: .875rem;
    overflow-wrap: anywhere;
}
body.centrum-internal .oc-oferta-ecl .bootstrap-select.form-control {
    padding: 0 !important;
    border: 0 !important;
    height: auto !important;
}
body.centrum-internal .oc-oferta-ecl .bootstrap-select > .dropdown-toggle {
    min-height: 40px;
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dce3ef;
    border-radius: 8px;
    background: #fff;
    color: var(--ecl-ink);
    font-size: .875rem;
}
body.centrum-internal .oc-oferta-ecl .form-row:has(> .form-group > input[type="checkbox"]) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
    margin: 12px 0 20px;
    padding: 0;
}
body.centrum-internal .oc-oferta-ecl .form-row > .form-group:has(> input[type="checkbox"]) {
    display: flex;
    align-items: flex-start;
    width: auto;
    max-width: none;
    padding: 12px;
    margin: 0;
    border: 1px solid #e4e8f1;
    border-radius: 8px;
    background: #f8faff;
}
body.centrum-internal .oc-oferta-ecl .form-group > input[type="checkbox"] {
    flex: 0 0 auto;
    margin: 3px 0 0;
}
body.centrum-internal .oc-oferta-ecl .form-group > input[type="checkbox"] + label {
    flex: 1;
    min-width: 0;
    margin: 0;
    cursor: pointer;
}
body.centrum-internal .oc-oferta-ecl .form-check-label b {
    font-weight: 600;
}
@container (max-width: 760px) {
    body.centrum-internal .oc-oferta-ecl .form-row:has(> .form-group > input[type="checkbox"]) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .oc-oferta-ecl .form-row > .form-group.col-md-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@container (max-width: 520px) {
    body.centrum-internal .oc-oferta-ecl .form-row:has(> .form-group > input[type="checkbox"]) {
        grid-template-columns: minmax(0, 1fr);
    }
    .oc-oferta-ecl .form-row > .form-group.col-md-4,
    .oc-oferta-ecl .form-row > .form-group.col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}
@media (max-width: 767.98px) {
    body.centrum-internal .modal > .modal-dialog,
    body.centrum-internal .modal:has(.oc-oferta-ecl) > .modal-dialog {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        margin: 12px auto;
    }
    body.centrum-internal .modal .oc-oferta-ecl .ecl-card {
        padding: 14px;
    }
}

/* Calendario nativo: conserva su contenedor y las coordenadas del componente original.
   Solo mientras está abierto se permite que sobresalga de los antecesores que lo recortan.
   La ventana modal conserva el desplazamiento del contenido en el área de la pantalla. */
body.centrum-internal :is(.funcion_fecha, .funcion_fecha1, .funcion_hora):has(input),
body.centrum-internal :is(.form-group, .input-group, .documento-campo):has(> .bootstrap-datetimepicker-widget) {
    position: relative;
}
body.centrum-internal :not(.modal):has(.bootstrap-datetimepicker-widget.dropdown-menu) {
    overflow: visible !important;
}
body.centrum-internal .modal:has(.bootstrap-datetimepicker-widget.dropdown-menu) {
    overflow-x: hidden;
    overflow-y: auto;
}
body.centrum-internal .bootstrap-datetimepicker-widget.dropdown-menu,
body.centrum-internal .datepicker-dropdown,
body.centrum-internal #ui-datepicker-div {
    z-index: 2147483647 !important;
}

/* Ritmo compacto para la sección de trabajo y sus mensajes auxiliares. */
body.centrum-internal .oc-oferta-ecl .title :is(h2, h3) {
    font-size: clamp(1.1rem, 2vw, 1.5rem);
    line-height: 1.35;
    overflow-wrap: anywhere;
}

body.centrum-internal .oc-oferta-ecl .ecl-btn {
    max-width: 100%;
    white-space: normal;
}
@media (max-width: 575.98px) {
    body.centrum-internal .oc-oferta-ecl .ecl-btn {
        padding: 10px 16px;
        font-size: .875rem;
    }
}


/* ======================================================================
   PRESENTACIÓN INTERNA COMPACTA
   Escala común para vistas modernas, formularios antiguos y fragmentos AJAX.
   Solo presentación: no modifica visibilidad, orden, datos ni componentes.
   ====================================================================== */
body.centrum-internal {
    --ecl-density-font: 12px;
    --ecl-density-label: 12px;
    --ecl-density-control: 30px;
    --ecl-radius: 10px;
    --ecl-shadow: 0 5px 18px -14px rgba(6, 19, 58, .28);
    font-size: var(--ecl-density-font);
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) {
    font-size: var(--ecl-density-font);
    line-height: 1.45;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(h1, h2, h3, h4, h5, h6):not(.ecl-hero *) {
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: -.015em;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) h1:not(.ecl-hero *) { font-size: 23px; }
body.centrum-internal :is(#contenedor_principal, .modal-body) h2:not(.ecl-hero *) { font-size: 18px; }
body.centrum-internal :is(#contenedor_principal, .modal-body) h3:not(.ecl-hero *) { font-size: 16px; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(h4, h5, h6):not(.ecl-hero *) { font-size: 14px; }
body.centrum-internal :is(#contenedor_principal, .modal-body) p:not(.ecl-hero *) { margin-bottom: 6px; }
body.centrum-internal :is(#contenedor_principal, .modal-body) hr { margin: 12px 0; }

/* Más superficie útil y menos altura en cabeceras. */
body.centrum-internal #contenedor_principal { padding-top: 14px; }
body.centrum-internal #contenedor_principal > .container-custom,
body.centrum-internal #contenedor_principal .container-custom {
    width: 100%;
    max-width: none;
}
body.centrum-internal .ecl-page { padding: 16px 20px 24px; }
body.centrum-internal :is(.ecl-page-head, .ecl-section-head, .ecl-block-head) {
    margin-bottom: 12px;
    gap: 8px;
}
body.centrum-internal :is(.ecl-section-head, .ecl-block-head) :is(h2, h3) {
    font-size: 16px;
    font-weight: 600;
    padding-bottom: 7px;
}
body.centrum-internal .ecl-block-head { padding-bottom: 10px; }
body.centrum-internal .ecl-block-head .ic { width: 32px; height: 32px; border-radius: 8px; }
body.centrum-internal .ecl-divider { height: 2px; margin: 16px 0; }
body.centrum-internal .ecl-toolbar { margin: 10px 0 12px !important; gap: 8px; }
body.centrum-internal :is(.ecl-grid, .ecl-accounting-grid) { gap: 12px; }
body.centrum-internal :is(.ecl-card, .ecl-user, .ecl-accounting-card) {
    padding: 12px;
    margin-bottom: 10px;
    border-radius: 10px;
    box-shadow: var(--ecl-shadow);
}
body.centrum-internal #contenedor_principal :is(.card, .card-header, .card-body) {
    border-color: var(--ecl-line);
}
body.centrum-internal #contenedor_principal .card {
    border-radius: 10px;
    box-shadow: var(--ecl-shadow);
}
body.centrum-internal #contenedor_principal .card-header {
    padding: 9px 12px;
    font-size: 12px;
    font-weight: 600;
    background: #f8faff;
}
body.centrum-internal #contenedor_principal .card-body { padding: 12px; }
body.centrum-internal .ecl-user .name { font-size: 14px; }
body.centrum-internal .ecl-user .data { font-size: 12px; line-height: 1.45; }

/* Márgenes utilitarios de las vistas antiguas: misma escala que las nuevas. */
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mt-5, .my-5) { margin-top: 18px !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mb-5, .my-5) { margin-bottom: 18px !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mt-4, .my-4) { margin-top: 12px !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mb-4, .my-4) { margin-bottom: 12px !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mt-3, .my-3) { margin-top: 8px !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.mb-3, .my-3) { margin-bottom: 8px !important; }

/* Formularios: etiquetas legibles y campos de altura uniforme. */
body.centrum-internal :is(#contenedor_principal, .modal-body) .form-group { margin-bottom: 10px; min-width: 0; }
body.centrum-internal :is(#contenedor_principal, .modal-body) label {
    margin-bottom: 3px !important;
    font-size: var(--ecl-density-label) !important;
    font-weight: 500;
    line-height: 1.35;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) label b { font-weight: 600; }
body.centrum-internal :is(#contenedor_principal, .modal-body) .form-control {
    height: var(--ecl-density-control) !important;
    min-height: var(--ecl-density-control);
    padding: 5px 9px !important;
    font-size: var(--ecl-density-font) !important;
    line-height: 1.4;
    border-width: 1px !important;
    border-radius: 6px !important;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) textarea.form-control {
    height: auto !important;
    min-height: 72px;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) select.form-control[multiple]:not(.selectpicker) {
    height: auto !important;
    min-height: 96px;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) .bootstrap-select.form-control {
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) .bootstrap-select > .dropdown-toggle {
    min-height: var(--ecl-density-control) !important;
    padding: 5px 9px !important;
    font-size: var(--ecl-density-font) !important;
    line-height: 1.4;
    border-radius: 6px;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) .form-control[type="file"] {
    height: auto !important;
    min-height: 34px;
    padding: 4px 7px !important;
}
body.centrum-internal .ecl-search {
    min-height: 32px;
    min-width: min(200px, 100%);
    padding: 5px 9px;
    font-size: 13px;
    border-radius: 6px;
}
body.centrum-internal :is(.ecl-btn, .ecl-chip, .ecl-analytics-filters .btn, .ecl-accounting-card .btn) {
    min-height: 32px !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    border-radius: 7px !important;
    gap: 6px;
}
body.centrum-internal :is(#contenedor_principal, .modal-body, .modal-footer) .btn:not(.btn-link) {
    padding: 6px 11px !important;
    font-size: 12px !important;
    line-height: 1.4;
}
body.centrum-internal :is(.ecl-analytics-filters, .ecl-kpis-filters) {
    padding: 14px 16px;
    margin: 14px 0 12px;
    gap: 12px;
    border-radius: 10px;
}
body.centrum-internal .ecl-accounting-card h2 { margin: 0 0 12px; font-size: 14px; text-transform: none; }
body.centrum-internal :is(#contenedor_principal, .modal-body) .nav-tabs .nav-link { padding: 7px 11px; font-size: 12px; }

/* Tablas existentes y DataTables: datos completos con menos altura por fila. */
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.table, .ecl-table, .stripe, .display, table.dataTable, .ecl-ro-table, table:where(#dataTable, #tabla-bot)):not(.ecl-load-table) {
    font-size: 12px !important; line-height: 1.45; color: #253650;
    width: 100%; border-collapse: separate; border-spacing: 0;
    border: 1px solid #dce5ef; border-radius: 6px; background: #fff;
    box-shadow: none;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.table, .ecl-table, .stripe, .display, table.dataTable, .ecl-ro-table, table:where(#dataTable, #tabla-bot)) thead th {
    padding: 8px 9px !important; font-size: 11px !important; font-weight: 600 !important;
    letter-spacing: .025em; line-height: 1.35; text-transform: none;
    border: 0 !important; border-bottom: 2px solid var(--ecl-blue-500) !important;

    color: var(--ecl-ink) !important; background: var(--ecl-soft) !important;
}
body.centrum-internal :is(#contenedor_principal, .modal-body) :is(.table, .ecl-table, .stripe, .display, table.dataTable, .ecl-ro-table, table:where(#dataTable, #tabla-bot)) tbody td {
    padding: 8px 9px !important; font-size: 12px !important; line-height: 1.45;
    border: 0 !important; border-bottom: 1px solid var(--ecl-line) !important;
    vertical-align: top; color: var(--ecl-ink);
}
body.centrum-internal :is(#contenedor_principal, .modal-body) td label { font-size: inherit !important; }
body.centrum-internal :is(#contenedor_principal, .modal-body) td br + br { display: none; }
body.centrum-internal :is(.dataTables_wrapper, .dt-container) :is(input, select) {
    min-height: 30px;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 6px;
}
body.centrum-internal :is(.dataTables_info, .dt-info, .dataTables_paginate, .dt-paging) { font-size: 11px; }

/* Formulario por pasos: menos ancho dedicado a adornos y más a los datos. */
body.centrum-internal .ff-step {
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: 12px;
    border-radius: 10px;
    box-shadow: var(--ecl-shadow);
}
body.centrum-internal .ff-step-aside { padding: 9px 12px; gap: 8px; flex-direction: row; align-items: center; border-right: 0; border-bottom: 1px solid var(--ecl-line); background: transparent;}

body.centrum-internal .ff-step-ic { width: 30px; height: 30px; font-size: 14px; border-radius: 8px; }
body.centrum-internal .ff-step-title { font-size: 13px; line-height: 1.35; }
body.centrum-internal .ff-step-body { padding: 12px; min-width: 0;}

/* Modales: se conservan las anchuras corregidas y el componente de calendario. */


body.centrum-internal .modal .oc-oferta-ecl .ecl-card { padding: 12px; margin-bottom: 10px; }
body.centrum-internal .oc-oferta-ecl #detalles_trabajo > .title { margin: 0 0 10px !important; }
body.centrum-internal .oc-oferta-ecl .title :is(h2, h3) { font-size: 16px; }
body.centrum-internal .oc-oferta-ecl .form-row:has(> .form-group > input[type="checkbox"]) { gap: 6px; margin: 6px 0 12px; }
body.centrum-internal .oc-oferta-ecl .form-row > .form-group:has(> input[type="checkbox"]) { padding: 8px 10px; gap: 6px; }
body.centrum-internal .oc-oferta-ecl :is(#div_incidencias, #div_credito_cliente) { margin-bottom: 4px !important; }
body.centrum-internal #myModal.modal-detalle-carga-grande :is(.modal-body, .ecl-ro) { padding: 12px !important; font-size: 13px !important; }
body.centrum-internal #myModal.modal-detalle-carga-grande .ecl-ro-sec { margin-bottom: 12px !important; }
body.centrum-internal #myModal.modal-detalle-carga-grande .ecl-ro-title { margin-bottom: 9px !important; font-size: 12px !important; }
body.centrum-internal #myModal.modal-detalle-carga-grande .ecl-ro-value { font-size: 13px !important; }
body.centrum-internal #myModal.modal-detalle-carga-grande .ecl-ro-value.big { font-size: 17px !important; }
body.centrum-internal :is(.funcion_fecha, .funcion_fecha1, .funcion_hora, .date-picker-container):has(input) { position: relative !important; }

@media (max-width: 991.98px) {
    body.centrum-internal #contenedor_principal { padding-top: 64px; }
}
@media (max-width: 767.98px) {
    body.centrum-internal .ff-step { grid-template-columns: minmax(0, 1fr); }
    body.centrum-internal .ff-step-aside { padding: 9px 12px; gap: 8px; flex-direction: row; align-items: center; border-right: 0; border-bottom: 1px solid var(--ecl-line); background: transparent;}
    body.centrum-internal .ff-step-body { padding: 12px; min-width: 0;}
    body.centrum-internal .ecl-page { padding: 12px 10px 18px; }
    body.centrum-internal :is(.ecl-card, .ecl-user, .ecl-accounting-card) { padding: 12px; }
}

/* Ajustes de los componentes que mantenían dimensiones del tema anterior. */
body.centrum-internal .ecl-accounting-content { margin-top: 14px; }
body.centrum-internal .ecl-accounting-grid > .ecl-accounting-card,
body.centrum-internal .ecl-grid > .ecl-user { margin-bottom: 0; }
body.centrum-internal .ecl-analytics-table-card { padding: 12px; border-radius: 10px; }

body.centrum-internal :is(#contenedor_principal, .modal-body) table .ecl-btn {
    min-height: 28px !important;
    padding: 4px 8px !important;
    margin: 2px !important;
}
body.centrum-internal .ecl-menu-btn,
body.centrum-internal .ecl-act { width: 28px; height: 28px; font-size: 16px; }
body.centrum-internal .ecl-menu-btn i { margin: 0 !important; }
body.centrum-internal .ecl-menu-item { padding: 6px 9px; font-size: 12px; border-radius: 6px; }
body.centrum-internal .ecl-kpi-summary { padding: 14px !important; gap: 12px; background: #edf1f8; border-radius: 10px; }
body.centrum-internal .ecl-kpi-side { gap: 10px; }
body.centrum-internal .ecl-kpi-summary .ecl-kpi-side > h3 { font-size: 17px !important; }
body.centrum-internal .ecl-kpi-summary .card-title { font-size: 11px !important; line-height: 1.35 !important; }
body.centrum-internal .ecl-kpi-summary .card-body { padding: 10px 12px !important; }
body.centrum-internal .ecl-kpi-summary .card-body h4 { font-size: 16px !important; line-height: 1.3 !important; }
body.centrum-internal .ecl-kpis-page .grid-margin { margin-bottom: 12px; }
body.centrum-internal .ecl-kpis-page .content-wrapper > .row:not(.ecl-kpi-summary) { margin-top: 12px !important; }
body.centrum-internal .ecl-kpis-filters #enviar { height: 32px !important; min-height: 32px !important; }
@media (min-width: 1100px) {
    body.centrum-internal .ecl-kpis-filters #enviar { margin-top: 19px !important; }
    body.centrum-internal .ecl-kpis-periods { margin-top: 19px; font-size: 12px; }
}

/* Se conserva el espacio de los indicadores de ordenación de DataTables. */
body.centrum-internal :is(#contenedor_principal, .modal-body) table.dataTable thead th:is(.sorting, .sorting_asc, .sorting_desc, .dt-orderable-asc, .dt-orderable-desc) {
    padding-right: 26px !important;
}


/* Los banners conservan la escala anterior; la densidad se aplica al contenido. */
body.centrum-internal .ecl-hero { font-size: 16px; line-height: 1.7; background: var(--ecl-grad-blue); color: #fff; box-shadow: inset 0 -2px 0 var(--ecl-orange-500), var(--ecl-shadow);  border-radius: 12px;}
body.centrum-internal .ecl-hero::after { background: transparent; }

/* Familia visual común de modales, manteniendo sus tamaños y funciones específicas. */
body.centrum-internal .modal .modal-content,
body.centrum-public .modal .modal-content {
    border: 1px solid var(--ecl-line) !important; border-radius: 12px !important; background: var(--ecl-paper);
    box-shadow: 0 20px 64px -24px rgba(25, 59, 99, .25);
}
body.centrum-internal .modal .modal-header,
body.centrum-public .modal .modal-header {
    padding: 12px 16px; border: 0; border-bottom: 2px solid var(--ecl-orange-500) !important;
    background: var(--ecl-grad-blue) !important; color: #fff; border-radius: 11px 11px 0 0;
}
body.centrum-internal .modal .modal-title,
body.centrum-public .modal .modal-title { margin: 0 !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.4; color: #fff !important; }
body.centrum-internal .modal .modal-header .close,
body.centrum-public .modal .modal-header .close { color: #fff; opacity: .85; text-shadow: none; font-size: 23px; }
body.centrum-internal .modal .modal-body,
body.centrum-public .modal .modal-body { padding: 12px; background: var(--ecl-paper); font-size: 12px; line-height: 1.45; color: var(--ecl-ink); }
body.centrum-internal .modal .modal-footer,
body.centrum-public .modal .modal-footer { padding: 10px 16px; border-top: 1px solid var(--ecl-line); background: var(--ecl-soft); border-radius: 0 0 11px 11px; }
body.centrum-internal .modal-body > :is(.container, .container.row),
body.centrum-internal .modal-body > form > .container {
    width: 100%; max-width: none; margin: 0; padding: 0;
}
body.centrum-internal .modal-body > .container.row { display: block; }
body.centrum-internal .modal-body > .container.row > .col-md-12 { padding-left: 0; padding-right: 0; }
body.centrum-internal .modal-body .ecl-page { background: transparent; }
body.centrum-internal .modal-body .title { padding-bottom: 8px; margin-bottom: 12px; border-bottom: 1px solid var(--ecl-line); }
body.centrum-internal .modal-body .title :is(h2, h3, h4, h5) { margin-bottom: 0; font-size: 15px; line-height: 1.35; }

/* Ofertas de carga: jerarquía por columna, sin alterar columnas ni valores de ordenación. */
body.centrum-internal #contenedor_principal table.ecl-load-table {
    table-layout: auto;
    box-shadow: 0 5px 20px -16px rgba(6, 19, 58, .3);
}
body.centrum-internal #contenedor_principal table.ecl-load-table tbody > tr > td {
    padding: 12px 10px !important;
    border-bottom: 2px solid #dfe5f0 !important;
    border-right: 1px solid #edf0f6 !important;
    vertical-align: top;
    font-size: 12px !important;
    line-height: 1.45;
}
body.centrum-internal .ecl-load-table .ecl-load-actions { min-width: 135px; width: 145px; }
body.centrum-internal .ecl-load-table .ecl-load-identity { min-width: 62px; font-weight: 700; color: var(--ecl-blue-500); white-space: nowrap; }
body.centrum-internal .ecl-load-table .ecl-load-audit { min-width: 110px; color: var(--ecl-mute); font-size: 11px !important; }
body.centrum-internal .ecl-load-table .ecl-load-audit strong { display: block; margin-top: 6px; line-height: 1.3; color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-load-sale-date { min-width: 80px; font-variant-numeric: tabular-nums; }
body.centrum-internal .ecl-load-table :is(.ecl-load-pickup, .ecl-load-delivery) { min-width: 165px; }
body.centrum-internal .ecl-load-table :is(.ecl-load-client, .ecl-load-carrier) { min-width: 160px; }
body.centrum-internal .ecl-load-table .ecl-load-metrics { min-width: 110px; }
body.centrum-internal .ecl-load-table .ecl-load-prices { min-width: 115px; font-variant-numeric: tabular-nums; }
body.centrum-internal .ecl-load-table .ecl-load-comments { min-width: 110px; max-width: 210px; overflow-wrap: anywhere; color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-load-prices strong { display: block; margin: 4px 0; color: var(--ecl-blue-900); font-size: 16px; font-weight: 600 !important; }
body.centrum-internal .ecl-load-table .ecl-pin { gap: 7px; padding: 0 0 10px; }
body.centrum-internal .ecl-load-table .ecl-pin + .ecl-pin { border-top: 1px dashed #dfe5f0; }
body.centrum-internal .ecl-load-table .ecl-pin-flag { width: 25px; height: 25px; border-radius: 7px; }
body.centrum-internal .ecl-load-table .ecl-pin-body { min-width: 0; }
body.centrum-internal .ecl-load-table .ecl-pin-place { margin: 0 0 5px; line-height: 1.4; }
body.centrum-internal .ecl-load-table .ecl-pin-chips { gap: 4px; margin: 0 0 6px; }
body.centrum-internal .ecl-load-table .ecl-chip-data { border-radius: 5px; }
body.centrum-internal .ecl-load-table .ecl-pin-date { margin: 4px 0 0; line-height: 1.4; font-variant-numeric: tabular-nums; }
body.centrum-internal .ecl-load-table .ecl-load-label { display: block; font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-mini-card { padding: 0; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.centrum-internal .ecl-load-table .ecl-mini-head { margin-bottom: 6px; padding-bottom: 6px; border-bottom: 1px solid #e5eaf2; letter-spacing: .03em; }
body.centrum-internal .ecl-load-table .ecl-mini-ic { width: 22px; height: 22px; border-radius: 6px; font-size: 12px; }
body.centrum-internal .ecl-load-table .ecl-kv-row { margin: 0; padding: 4px 0; line-height: 1.35; }
body.centrum-internal .ecl-load-table .ecl-kv-k { display: block; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-kv-v { display: block; margin-top: 1px; overflow-wrap: anywhere; }
body.centrum-internal .ecl-load-table .ecl-kv-row:first-of-type .ecl-kv-v { font-weight: 600; }
body.centrum-internal .ecl-load-table .ecl-metric-row { line-height: 1.4; }
body.centrum-internal .ecl-load-table .ecl-metric-row b { display: block; margin: 0; color: var(--ecl-mute); font-weight: 500; font-size: 11px; }
body.centrum-internal .ecl-load-table .ecl-load-box { border: 1px solid #dfe5ef; border-radius: 7px; padding: 7px !important; margin: 6px 0; font-size: 11px; }
body.centrum-internal .ecl-load-table .ecl-load-box legend { font-size: 11px !important; font-weight: 600; color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-load-actions > br { display: none; }
body.centrum-internal .ecl-load-table .ecl-load-actions > .btn { display: block; width: 100%; margin: 5px 0; white-space: normal; font-size: 10.5px !important; }

body.centrum-internal #myModal.modal-detalle-carga-grande .modal-header .modal-title { font-size: 15px !important; line-height: 1.4; }

body.centrum-internal .ecl-load-table .ecl-load-actions textarea { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; font-size: 12px; }
body.centrum-internal .ecl-load-table .ecl-load-box { min-width: 0; overflow-wrap: anywhere; }
body.centrum-internal .ecl-load-table .ecl-load-box .btn { max-width: 100%; white-space: normal; }

body.centrum-internal #contenedor_principal table.ecl-load-table :is(th, td) { text-align: left !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table td.ecl-load-prices { text-align: right !important; }
body.centrum-internal .ecl-load-table .ecl-load-actions :is(textarea, .ecl-load-box) { width: 155px; max-width: 100%; }

body.centrum-internal .ecl-load-table .btn { letter-spacing: 0 !important; }

/* Diseño aprobado: cada oferta mantiene sus celdas y contratos de DataTables. */
body.centrum-internal #contenedor_principal table.ecl-load-table {
    display: table; width: 100% !important; min-width: 0 !important;
    table-layout: fixed; border-collapse: separate; border-spacing: 0;
    background: transparent; border-radius: 0; box-shadow: none;
}
body.centrum-internal #contenedor_principal .ecl-load-table :is(thead, tbody) { display: block; width: 100%; }
body.centrum-internal #contenedor_principal .ecl-load-table colgroup { display: none; }
body.centrum-internal #contenedor_principal .ecl-load-table thead tr {
    display: flex; flex-wrap: wrap; gap: 4px; padding: 5px 0 10px; background: transparent;
}
body.centrum-internal #contenedor_principal .ecl-load-table thead th {
    display: block; width: auto !important; flex: 1 0 auto; min-width: 0;
    border: 1px solid #dce4ef !important; border-radius: 5px;
    background: #f1f5fa !important; color: #365779 !important;
    font-size: 11px !important; padding: 6px 26px 6px 9px !important;
}
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr:has(> td .ecl-load-identity) {
    display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px; padding: 0 14px 12px; margin: 0 0 22px;
    position: relative; isolation: isolate; overflow: visible;
    border: 1px solid #c7d4e5; border-radius: 9px;
    background-color: #fff; box-shadow: 0 5px 16px rgba(25, 59, 99, .08);
    color: #253651;
}
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr:has(> td .ecl-load-identity)::before {
    content: ''; grid-column: 1 / -1; grid-row: 1; margin: 0 -14px;
    background: #193b63; border-bottom: 2px solid #da9b58;
    border-radius: 8px 8px 0 0; min-height: 42px; z-index: -1;
}
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr:where(:has(> td .ecl-load-identity)) > td {
    display: block; min-width: 0; width: auto !important; max-width: none;
    padding: 10px 12px !important; border: 1px solid #e0e7f0 !important;
    border-radius: 5px; font-size: 11px !important; line-height: 1.45;
    background: #fff; box-shadow: none !important; overflow-wrap: anywhere;
    margin: 0; align-self: stretch; text-align: left !important;
}
body.centrum-internal #contenedor_principal .ecl-load-table td[data-label]::before {
    content: attr(data-label); margin-bottom: 7px;
    font-size: 11px; font-weight: 600; letter-spacing: .045em;
    text-transform: uppercase; color: #7287a3;
}
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-identity) {
    grid-column: 1 / 7; grid-row: 1; padding: 11px 2px !important;
    background: transparent; border: 0 !important; color: #fff;
    font-weight: 600; font-size: 14px !important; align-self: center;
}
body.centrum-internal .ecl-load-offer-caption { font-size: 11px; font-weight: 500; color: #c3d2e5; margin-right: 6px; letter-spacing: .05em; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-sale-date) {
    grid-column: 7 / -1; grid-row: 1; padding: 11px 42px 11px 0 !important;
    background: transparent; border: 0 !important; color: #d9e5f4;
    text-align: right !important; font-size: 11px !important; align-self: center;
}
body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-sale-date)::before { display: inline; text-transform: none; color: #bbcfe7; font-size: 11px; margin-right: 6px; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-pickup) { grid-column: 1 / 4; grid-row: 2; background: #f2f6fc; border-top: 2px solid #658abb !important; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-delivery) { grid-column: 4 / 7; grid-row: 2; background: #fcf7f0; border-color: #ebdfcd !important; border-top: 2px solid #cf9b60 !important; }
body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-delivery)::before { color: #a28460; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-metrics) { grid-column: 7 / 10; grid-row: 2; background: #f8fafd; border-top: 2px solid #a6b8ce !important; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-prices) { grid-column: 10 / -1; grid-row: 2; background: #f2f6fc; border-top: 2px solid #7893b4 !important; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-content: start; text-align: right !important; }
body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-prices)::before { grid-column: 1 / -1; text-align: left; }
body.centrum-internal .ecl-load-table .ecl-price-label { display: block; color: #7287a3; font-size: 11px; font-weight: 400; margin-bottom: 4px; }
body.centrum-internal .ecl-load-table :is(.ecl-price-buy, .ecl-price-sale, .ecl-price-benefit) { min-width: 0; font-size: 11px; }
body.centrum-internal .ecl-load-table :is(.ecl-price-sale, .ecl-price-benefit) { border-left: 1px solid #dfe7f1; padding-left: 7px; }
body.centrum-internal .ecl-load-table .ecl-price-amount,
body.centrum-internal .ecl-load-table .ecl-load-prices strong { display: block; color: #26466d; font-size: 13px; font-weight: 600; margin: 4px 0; }
body.centrum-internal .ecl-load-table .ecl-load-prices br { display: none; }
body.centrum-internal .ecl-load-table .ecl-price-benefit { color: var(--ecl-mute); }
body.centrum-internal .ecl-load-table .ecl-price-benefit > span:not(.ecl-number) { display: block; margin-bottom: 4px; font-size: 11px; font-weight: 400 !important; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-client) { grid-column: 1 / 5; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-carrier) { grid-column: 5 / 9; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-comments) { grid-column: 9 / -1; grid-row: 3; background: #fdfcf9; color: #52627b; }
body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-comments)::before { color: #9c7d54; }
body.centrum-internal .ecl-load-table .ecl-mini-head { border: 0; color: #7287a3; margin: 0 0 6px; padding: 0; font-size: 11px; font-weight: 600; text-transform: uppercase; }
body.centrum-internal .ecl-load-table .ecl-mini-ic { display: none; }
body.centrum-internal .ecl-load-table .ecl-kv-row { display: grid; grid-template-columns: minmax(75px, 28%) minmax(0, 1fr); gap: 7px; padding: 2px 0; }
body.centrum-internal .ecl-load-table .ecl-kv-k { font-size: 11px; line-height: 1.45; }
body.centrum-internal .ecl-load-table .ecl-kv-v { margin: 0; font-size: 11px; line-height: 1.45; }
body.centrum-internal .ecl-load-table .ecl-mini-actions { margin-top: 5px; }
body.centrum-internal .ecl-load-table .ecl-pin { padding-bottom: 0; }
body.centrum-internal .ecl-load-table .ecl-pin-rail { display: none; }
body.centrum-internal .ecl-load-table .ecl-pin-place { font-size: 13px; font-weight: 600; color: #234b79; }
body.centrum-internal .ecl-load-table .ecl-load-delivery .ecl-pin-place { color: #785b38; }
body.centrum-internal .ecl-load-table .ecl-pin + .ecl-pin { margin-top: 10px; padding-top: 10px; }
body.centrum-internal .ecl-load-table .ecl-chip-data { font-size: 11px; padding: 2px 6px; background: #fff9; }
body.centrum-internal .ecl-load-table .ecl-pin-date { font-size: 10.5px; }
body.centrum-internal .ecl-load-table .ecl-metric-row { display: flex; flex-wrap: wrap; gap: 5px; font-size: 11px; margin-bottom: 5px; }
body.centrum-internal .ecl-load-table .ecl-track-code { font-size: 11px; padding: 3px 7px; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-actions) {
    grid-column: 1 / -1; grid-row: 4; background: #fbfcfe; padding: 0 !important;
    border: 0 !important; min-width: 0;
}
body.centrum-internal tr:has(> td .ecl-load-identity) .ecl-load-actions > .ecl-menu { position: absolute; top: 7px; right: 12px; z-index: 5; }
body.centrum-internal tr:has(> td .ecl-load-identity) .ecl-menu-btn { background: #ffffff12; border: 1px solid #ffffff40; color: white; width: 29px; height: 27px; border-radius: 4px; }
body.centrum-internal .ecl-load-documentation { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 14px; padding: 10px 12px; border: 1px solid #e0e7f0; border-radius: 5px; }
body.centrum-internal .ecl-load-documentation > br { display: none; }
body.centrum-internal .ecl-load-documentation > :is(fieldset, .ecl-load-box) { flex: 1 1 220px; width: auto; margin: 0; }
body.centrum-internal .ecl-load-documentation textarea { width: 240px !important; max-width: 100%; height: 48px; min-height: 32px; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-audit) {
    grid-column: 1 / -1; grid-row: 5; margin: 0 -14px -12px; padding: 7px 14px !important;
    border: 0 !important; border-top: 1px solid #dde6f1 !important; border-radius: 0 0 8px 8px;
    background: #f1f5fa; color: #70849e; font-size: 11px !important;
}
body.centrum-internal .ecl-load-table .ecl-load-audit strong { display: inline; margin-left: 14px; color: #70849e; font-size: 11px; }
body.centrum-internal .ecl-load-table .ecl-load-audit br { display: none; }
body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-audit)::before { display: inline; text-transform: none; margin-right: 5px; font-size: 11px; }
/* Las advertencias originales se conservan y destacan toda la oferta. */
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):has(.rojo) { border-color: #dba6a6; }
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):has(.rojo)::before { background: #723743; }
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-client)) > td:has(> .ecl-load-comments) { grid-column: 1 / -1; }
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-metrics) { grid-column: 9 / -1; }
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-pickup) { grid-column: 1 / 5; }
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-delivery) { grid-column: 5 / 9; }

/* Modal aprobada: datos comerciales y editor de puntos en paralelo. */

body.centrum-internal .oc-oferta-ecl #oc-datos-desplegable.ecl-offer-layout { padding: 0; margin: 0; border: 0; background: transparent; box-shadow: none; }
body.centrum-internal .oc-oferta-ecl #oc-datos-desplegable.ecl-offer-layout > summary { padding: 0 0 7px; margin-bottom: 12px; border-bottom: 1px solid #e1e7f0; font-size: 11px; font-weight: 500; color: #657994; }
body.centrum-internal .ecl-offer-layout .oc-datos-contenido { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 12px 14px; padding-top: 0; align-items: start; }
body.centrum-internal .ecl-offer-layout #cargas { display: contents; }
body.centrum-internal .ecl-offer-layout #cargas > section:not(#detalles_trabajo):not(.ecl-offer-points):not(#subida-oc),
body.centrum-internal .ecl-offer-layout .oc-datos-contenido > div { grid-column: 1 / -1; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo,
body.centrum-internal .ecl-offer-layout .ecl-offer-points { min-width: 0; padding: 12px; border: 1px solid #dce4ef; border-radius: 8px; background: #fff; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo { grid-column: 1; grid-row: 1; }
body.centrum-internal .ecl-offer-layout .ecl-offer-points { grid-column: 2; grid-row: 1 / span 2; }
body.centrum-internal .ecl-offer-layout #subida-oc { grid-column: 1; grid-row: 2; min-width: 0; padding: 10px 12px; margin: 0; border-radius: 8px; border-color: #dce4ef; box-shadow: none; }
body.centrum-internal .ecl-offer-layout .title { padding: 0 0 8px; margin: 0 0 10px !important; text-align: left !important; border-bottom: 1px solid #e8edf4; }
body.centrum-internal .ecl-offer-layout .title :is(h2,h3) { font-size: 12px !important; font-weight: 600 !important; margin: 0; color: #233d64 !important; }
body.centrum-internal .ecl-offer-layout .form-group { margin-bottom: 0 !important; padding: 0 !important; min-width: 0; max-width: none; width: auto; flex: initial; }
body.centrum-internal .ecl-offer-layout .form-group > label,
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row > div > label { font-size: 10.5px !important; font-weight: 500 !important; margin: 0 0 3px !important; line-height: 1.3; color: #526079; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px 12px; margin: 0 0 12px; padding: 0; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row > div { min-width: 0; max-width: none; padding: 0; width: auto; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row > .col-12,
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row > .title { grid-column: 1 / -1; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row:has(input[type="checkbox"]) { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin: 12px 0; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row > .form-group:has(>input[type="checkbox"]) { display: flex; gap: 5px; align-items: center; min-height: 36px; padding: 6px !important; background: #f7f9fc; border: 1px solid #e1e6ef; border-radius: 5px; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo .form-check-label { margin: 0 !important; font-size: 11px !important; font-weight: 500; line-height: 1.3; }
body.centrum-internal .ecl-offer-layout .form-check-label b { font-weight: 500; }
body.centrum-internal .ecl-offer-layout #detalles_trabajo input[type="checkbox"] { flex: 0 0 auto; margin: 0; }
body.centrum-internal .modal-body .ecl-offer-layout :is(input.form-control, select.form-control, .bootstrap-select > .dropdown-toggle) { min-height: 30px !important; height: 30px !important; font-size: 12px !important; padding: 4px 8px !important; border-radius: 5px; }
body.centrum-internal .modal-body .ecl-offer-layout .bootstrap-select { height: auto !important; min-width: 0 !important; max-width: 100%; width: 100% !important; }
body.centrum-internal .ecl-offer-layout textarea.form-control { min-height: 52px !important; height: 52px; padding: 5px 8px !important; font-size: 12px !important; border-radius: 5px; }
body.centrum-internal .ecl-offer-layout .ecl-offer-points > .wrapper { display: none; }
body.centrum-internal .ecl-offer-layout #div_cargas { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px 10px; margin: 10px 0 0 !important; }
body.centrum-internal .ecl-offer-layout #div_cargas > .form-row { display: contents; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group { grid-column: span 1; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#direccion_cargas) { grid-column: span 3; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#ciudad_cargas),
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#referencia) { grid-column: span 2; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#notas) { grid-column: 1 / -1; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) { grid-column: 1 / 4; align-self: center; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group > br { display: none; }
body.centrum-internal .ecl-offer-layout #div_cargas .actions { grid-column: 4; margin: 0 !important; justify-content: flex-end !important; align-self: end; }
body.centrum-internal .ecl-offer-layout #div_cargas > input[type="hidden"] { display: none; }
body.centrum-internal .ecl-offer-layout #fieldset_cargas { min-width: 0; overflow-x: auto; }
body.centrum-internal .ecl-offer-layout #fieldset_cargas:empty { display: none; }
body.centrum-internal .ecl-offer-layout #subida-oc > .title { margin-bottom: 8px !important; }
body.centrum-internal .modal-body .ecl-offer-layout #subida-oc input[type="file"] { height: auto !important; padding: 4px !important; font-size: 11px !important; }
body.centrum-internal .ecl-offer-layout #subida-oc > .row { margin: 7px 0 0; padding: 0; width: 100%; }
body.centrum-internal .ecl-offer-layout #subida-oc .form-group { margin: 0 !important; width: 100%; }
body.centrum-internal .ecl-offer-layout #subida-oc .form-group > .text-center { text-align: right !important; }
body.centrum-internal .ecl-offer-layout .ecl-offer-submit { grid-column: 1 / -1; margin: 0 !important; padding: 10px 0 0; border-top: 1px solid #e1e7f0; width: 100%; }
body.centrum-internal .ecl-offer-layout .ecl-offer-submit > .form-group { width: 100%; margin: 0 !important; }
body.centrum-internal .ecl-offer-layout .ecl-offer-submit .text-center { text-align: right !important; }
body.centrum-internal .ecl-offer-layout .oc-datos-contenido:has(#tabla-pujas) #detalles_trabajo { grid-row: auto; }
body.centrum-internal .ecl-offer-layout .oc-datos-contenido:has(#tabla-pujas) .ecl-offer-points { grid-row: auto; }
@media (max-width: 1100px) {
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-pickup) { grid-column: 1 / 7; grid-row: 2; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-delivery) { grid-column: 7 / -1; grid-row: 2; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-metrics) { grid-column: 1 / 7; grid-row: 3; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-prices) { grid-column: 7 / -1; grid-row: 3; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-client) { grid-column: 1 / 5; grid-row: 4; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-carrier) { grid-column: 5 / 9; grid-row: 4; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-comments) { grid-column: 9 / -1; grid-row: 4; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-actions) { grid-row: 5; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-audit) { grid-row: 6; }
    body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-pickup) { grid-column: 1 / 7; }
    body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-delivery) { grid-column: 7 / -1; }
    body.centrum-internal #contenedor_principal .ecl-load-table tr:has(> td .ecl-load-identity):not(:has(.ecl-load-prices)) > td:has(> .ecl-load-metrics) { grid-column: 1 / -1; }
    body.centrum-internal .ecl-offer-layout .oc-datos-contenido { grid-template-columns: minmax(0,1fr); }
    body.centrum-internal .ecl-offer-layout :is(#detalles_trabajo, .ecl-offer-points, #subida-oc) { grid-column: 1; grid-row: auto; }
}
@media (max-width: 767.98px) {
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr:has(> td .ecl-load-identity) { gap: 9px; padding: 0 10px 10px; margin-bottom: 18px; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr:has(> td .ecl-load-identity)::before { margin: 0 -10px; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-client) { grid-column: 1 / 7; grid-row: 4; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-carrier) { grid-column: 7 / -1; grid-row: 4; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-comments) { grid-column: 1 / -1; grid-row: 5; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-actions) { grid-row: 6; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-audit) { grid-row: 7; margin: 0 -10px -10px; padding: 7px 10px !important; }
    body.centrum-internal .ecl-load-table .ecl-kv-row { grid-template-columns: minmax(0,1fr); gap: 0; }
    body.centrum-internal .ecl-offer-layout #detalles_trabajo > .form-row:has(input[type="checkbox"]) { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.centrum-internal .ecl-offer-layout #div_cargas { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#direccion_cargas) { grid-column: 1 / -1; }
    body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) { grid-column: 1; }
    body.centrum-internal .ecl-offer-layout #div_cargas .actions { grid-column: 2; }
}
@media (max-width: 479.98px) {
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> :is(.ecl-load-pickup,.ecl-load-delivery,.ecl-load-metrics,.ecl-load-prices,.ecl-load-client,.ecl-load-carrier,.ecl-load-comments)) { grid-column: 1 / -1 !important; grid-row: auto; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-actions) { grid-row: 9; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-audit) { grid-row: 10; }
    body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr > td:has(> .ecl-load-sale-date) { font-size: 11px !important; }
    body.centrum-internal #contenedor_principal .ecl-load-table td:has(> .ecl-load-sale-date)::before { display: block; font-size: 11px; margin: 0; }
}
/* Los resultados AJAX conservan el contenido de cada celda, no los atributos del tr. */
body.centrum-internal .ecl-load-table .ecl-load-cell { display: contents; }
body.centrum-internal #contenedor_principal .ecl-load-table td[data-label]::before { display: none; }
body.centrum-internal .ecl-load-table .ecl-load-cell-label { display: block; font-size: 11px; font-weight: 600; letter-spacing: .045em; text-transform: uppercase; color: #7287a3; margin: 0 0 7px; }
body.centrum-internal .ecl-load-table .ecl-load-prices > .ecl-load-cell-label { grid-column: 1 / -1; text-align: left; }
body.centrum-internal .ecl-load-table .ecl-load-sale-date > .ecl-load-cell-label { display: inline; font-size: 11px; color: #bbcfe7; margin-right: 6px; text-transform: none; }
body.centrum-internal .ecl-load-table .ecl-load-audit > .ecl-load-cell-label { display: inline; font-size: 11px; margin-right: 5px; text-transform: none; }
body.centrum-internal .ecl-load-table .ecl-load-delivery > .ecl-load-cell-label { color: #a28460; }
body.centrum-internal .ecl-load-table .ecl-load-comments > .ecl-load-cell-label { color: #9c7d54; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr.detail-row { display: block; width: 100%; margin: -16px 0 22px; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody > tr.detail-row > td { display: block; width: 100%; }

body.centrum-internal .modal-body .ecl-offer-layout textarea.form-control { height: 52px !important; min-height: 52px !important; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) > label:first-child { flex-basis: 100%; }
body.centrum-internal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) > label[for] { display: inline; margin: 0 !important; }
body.centrum-internal .ecl-offer-layout #div_cargas input[type="radio"] { margin: 0; width: 13px; height: 13px; }
body.centrum-internal .ecl-offer-layout #subida-oc { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px 10px; }
body.centrum-internal .ecl-offer-layout #subida-oc > .title { grid-column: 1 / -1; padding: 0 0 7px; margin: 0 !important; }
body.centrum-internal .ecl-offer-layout #subida-oc > .row { margin: 0 !important; align-self: center; }
body.centrum-internal .ecl-offer-layout #subida-oc .title h3 { font-size: 11px !important; }
body.centrum-internal .ecl-offer-layout .ecl-btn { letter-spacing: 0 !important; font-weight: 500 !important; }

/* Ajustes finales de densidad y agrupación de las notas junto a su oferta. */
body.centrum-internal #contenedor_principal table.ecl-load-table thead { background: transparent !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table thead th { background: #f1f5fa !important; color: #365779 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) td:has(> .ecl-load-identity) { color: #fff !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) td:has(> .ecl-load-identity) .ecl-load-identity { color: #fff; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation { padding: 0; border: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation .ecl-load-box { padding: 7px 9px !important; border-radius: 5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation .ecl-load-box legend { padding: 0 4px !important; font-size: 11px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation .ecl-load-box br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation .formulario_anotaciones { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation textarea { height: 36px; font-size: 11px; flex: 1 1 180px; border: 1px solid #d7dfeb; border-radius: 4px; padding: 5px 7px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation input[type=submit] { padding: 4px 8px !important; font-size: 11px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation:empty { display: none; }
body.centrum-internal .modal:has(.ecl-offer-layout) > .modal-dialog { width: calc(100% - 40px) !important; max-width: 1440px !important; margin: 18px auto; }
body.centrum-internal .modal .ecl-offer-layout .title { margin: 0 0 10px !important; padding: 0 0 8px !important; }
body.centrum-internal .modal .ecl-offer-layout .title :is(h2,h3) { line-height: 1.3 !important; font-size: 12px !important; }
body.centrum-internal .modal .ecl-offer-layout #detalles_trabajo > .form-row { gap: 8px 12px; margin-bottom: 10px; }
body.centrum-internal .modal .ecl-offer-layout #detalles_trabajo > .form-row:has(input[type=checkbox]) { gap: 6px; margin: 10px 0; }
body.centrum-internal .modal .ecl-offer-layout #detalles_trabajo > .form-row > .form-group:has(>input[type=checkbox]) { min-height: 32px; padding: 5px 6px !important; }
body.centrum-internal .modal .ecl-offer-layout .form-group > label { display: block; }
body.centrum-internal .modal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) > label[for] { display: inline !important; }
body.centrum-internal .modal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) > label:first-child { margin-bottom: 0 !important; }
body.centrum-internal .modal .ecl-offer-layout #div_cargas .form-group:has(#tipo_operacion_carga) { gap: 4px; }


body.centrum-internal .modal .modal-body .ecl-offer-layout :is(#notas, #notas_detalles) { height: 52px !important; min-height: 52px !important; }
body.centrum-internal .modal .ecl-offer-layout .title :is(h2,h3) { margin: 0 !important; }

/* Distribución compacta aprobada: trayecto, empresas e importes próximos. */
@media (min-width: 1101px) {
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) {
    grid-template-columns: repeat(24, minmax(0,1fr)); grid-template-rows: auto auto auto auto auto auto auto;
    gap: 0 12px; padding: 0 14px 0; margin-bottom: 20px;
}
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-identity) { grid-column: 1 / 13; grid-row: 1; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-sale-date) { grid-column: 13 / -1; grid-row: 1; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-pickup) { grid-column: 1 / 11; grid-row: 2; margin-top: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-delivery) { grid-column: 1 / 11; grid-row: 3; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-metrics) { grid-column: 1 / 11; grid-row: 4; padding-bottom: 10px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-client) { grid-column: 11 / 16; grid-row: 2 / 5; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-carrier) { grid-column: 16 / 21; grid-row: 2 / 5; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-prices) { grid-column: 21 / -1; grid-row: 2 / 5; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:is(:has(> .ecl-load-pickup),:has(> .ecl-load-delivery),:has(> .ecl-load-metrics),:has(> .ecl-load-client),:has(> .ecl-load-carrier),:has(> .ecl-load-prices)) {
    background: transparent; border: 0 !important; border-radius: 0; padding: 6px 0 !important;
}
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:is(:has(> .ecl-load-client),:has(> .ecl-load-carrier),:has(> .ecl-load-prices)) { margin: 12px 0; border-left: 1px solid #e1e8f0 !important; padding: 0 0 0 14px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-kv-row { display: block; padding: 2px 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-kv-k { display: inline; margin-right: 5px; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-kv-v { display: inline; font-size: 10.5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-kv-row:first-of-type .ecl-kv-k { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(130px,.7fr); gap: 2px 8px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-place { grid-column: 1; grid-row: 1; margin: 0; font-size: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-chips { grid-column: 1; grid-row: 2; margin: 2px 0 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-date { grid-column: 2; margin: 0; text-align: right; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-date:nth-of-type(2) { grid-row: 1; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-date:nth-of-type(3) { grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-pin-body > :is(.ecl-track,.ecl-pin-inci,a) { grid-column: 1 / -1; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-label { display: inline; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-pickup > .ecl-load-cell-label,
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-delivery > .ecl-load-cell-label { margin-bottom: 3px; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-metrics > .ecl-load-cell-label { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-metrics { font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-metrics .ecl-metric-row,
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-metrics .ecl-chips-top { display: inline-flex; margin: 0 9px 0 0; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-metrics > br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-prices) { display: block; text-align: right !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-prices > .ecl-load-cell-label { text-align: left; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) :is(.ecl-price-buy,.ecl-price-sale,.ecl-price-benefit) { display: block; border: 0; padding: 0; margin-bottom: 8px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-price-label { display: block; text-align: left; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-price-benefit { padding-top: 7px; border-top: 1px solid #e1e8f0; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-comments) { grid-column: 1 / -1; grid-row: 5; min-height: 0; border: 0 !important; border-top: 1px solid #e1e8f0 !important; border-radius: 0; background: transparent; padding: 8px 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) .ecl-load-comments > .ecl-load-cell-label { display: inline; margin-right: 8px; text-transform: none; font-weight: 400; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-actions) { grid-column: 1 / -1; grid-row: 6; padding: 0 0 8px !important; background: transparent; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-audit) { grid-column: 1 / -1; grid-row: 7; margin: 0 -14px; }
/* Las filas sin datos empresariales conservan todo el ancho útil de su rol. */
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tr:not(:has(.ecl-load-client)) > td:has(> .ecl-load-pickup),
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tr:not(:has(.ecl-load-client)) > td:has(> .ecl-load-delivery),
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tr:not(:has(.ecl-load-client)) > td:has(> .ecl-load-metrics) { grid-column: 1 / 18; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tr:not(:has(.ecl-load-client)) > td:has(> .ecl-load-prices) { grid-column: 18 / -1; }
body.centrum-internal #contenedor_principal table.ecl-load-table:where(:not(.ecl-cargas-table)) tr:not(:has(.ecl-load-client)):not(:has(.ecl-load-prices)) > td:is(:has(> .ecl-load-pickup),:has(> .ecl-load-delivery),:has(> .ecl-load-metrics)) { grid-column: 1 / -1; }
}
/* Menú anclado al botón: abre hacia dentro y supera las ofertas contiguas. */
body.centrum-internal #contenedor_principal .ecl-load-table .ecl-menu-panel {
    border-top: 2px solid var(--ecl-orange-500);
    left: auto; right: 0; top: calc(100% + 6px); min-width: 0;
    width: min(280px, calc(100vw - 54px)); max-height: min(60vh, 440px);
    border-radius: 7px; z-index: 100; overflow-x: hidden; overflow-y: auto;
}
body.centrum-internal #contenedor_principal .ecl-load-table tr:has(.ecl-menu.open) { z-index: 30; }
body.centrum-internal #contenedor_principal .table-responsive:has(.ecl-load-table .ecl-menu.open) { overflow: visible; }
/* Familia común de botones internos: misma geometría, colores según acción. */
body.centrum-internal :is(#contenedor_principal,.modal) :is(.btn,.ecl-btn):not(.btn-link) {
    border-radius: 5px !important; font-family: inherit; font-weight: 500 !important;
    letter-spacing: 0 !important; line-height: 1.35; box-shadow: none;
}


body.centrum-internal #contenedor_principal table.ecl-load-table :is(.btn,.ecl-document-delete) {
    min-height: 25px; border-radius: 5px !important; font-size: 11px !important;
    line-height: 1.3; padding: 4px 7px !important; font-weight: 500 !important;
    letter-spacing: 0 !important; box-shadow: none;
}
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-btn { min-height: 23px; height: 23px; display: inline-flex; align-items: center; gap: 4px; font-family: inherit; white-space: nowrap; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-btn::before { font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 11px; }
body.centrum-internal .ecl-document-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-download { border: 1px solid #cedded; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-upload { border: 1px solid #c8e2d7; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-delete { display: inline-flex; align-items: center; justify-content: center; background: #faedf0; border: 1px solid #edcdd3; color: #a34957 !important; width: 24px; height: 23px; min-height: 23px; margin: 0 0 0 4px !important; font-weight: 900 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item { border-radius: 4px; min-height: 29px; font-weight: 400; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item.danger { color: #ad642d; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item[onclick^="borrar"] { color: #a94451; background: #fff6f7; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item:is([onclick^="descargar"],[onclick^="imprimir"]) { color: #315e8b; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item[onclick^="subir"] { color: #28796c; }
body.centrum-internal :is(#contenedor_principal, .modal) .btn:hover{ filter: brightness(.95); }
body.centrum-internal #contenedor_principal table.ecl-load-table :is(.btn,.ecl-menu-btn):focus-visible { outline: 2px solid #658ab4; outline-offset: 2px; }@media (min-width: 1101px) {




body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-documentation textarea { height: 29px; min-height: 29px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-load-audit { margin-top: 0; }
}
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-download { background: #e9f0fa !important; border-color: #cedded !important; color: #315e8b !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-document-upload { background: #e7f3ee !important; border-color: #c8e2d7 !important; color: #2e7565 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item { white-space: normal; overflow-wrap: anywhere; min-width: 0; line-height: 1.4; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-item i { flex: 0 0 18px; }
body.centrum-internal #contenedor_principal table.ecl-load-table :is(.btn,.ecl-btn) { font-family: inherit !important; font-weight: 500 !important; text-transform: none !important; }
body.centrum-internal :is(#contenedor_principal, .modal) :is(.btn-warning, input.btn-warning, .ecl-btn--orange) { background: var(--ecl-orange-500) !important; border-color: var(--ecl-orange-500) !important; color: var(--ecl-blue-900) !important; }
body.centrum-internal :is(#contenedor_principal, .modal) :is(.btn-success,input.btn-success):not(.ecl-document-download) { background: #147b57 !important; border-color: #147b57 !important; color: #fff !important; }
body.centrum-internal :is(#contenedor_principal, .modal) .btn-danger{ background: #c92f4f !important; border-color: #c92f4f !important; color: #fff !important; }body.centrum-internal :is(#contenedor_principal, .modal) .btn.fas::before{ font-family: 'Font Awesome 5 Free'; font-weight: 900; }
body.centrum-internal :is(#contenedor_principal, .modal) :is(.btn-primary, .ecl-btn--blue):not(.ecl-document-upload) { background: var(--ecl-blue-500) !important; border-color: var(--ecl-blue-500) !important; color: #fff !important; }
body.centrum-internal :is(#contenedor_principal, .modal) .btn-info{ background: #e8f3f8 !important; border-color: #c6dfe9 !important; color: #326c88 !important; }
/* Todas las entradas del menú comparten formato de acción con icono Tabler. */
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-panel > .ecl-menu-item {
    display: flex; align-items: center; gap: 9px; width: 100%; height: auto;
    padding: 6px 9px !important; margin: 0; min-height: 29px;
    border: 0 !important; border-radius: 4px !important;
    background: transparent !important; box-shadow: none !important;
    font-family: inherit !important; font-size: 12px !important;
    font-weight: 400 !important; text-transform: none !important;
    letter-spacing: 0 !important; text-align: left; cursor: pointer;
}
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-panel > .ecl-menu-item:hover { background: #f1f5fa !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-menu-panel > .ecl-menu-item > i.ti { flex: 0 0 18px; width: 18px; margin: 0 !important; font-size: 16px; }
/* Fechas y seguimiento compactos, con el mismo significado de estados. */
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-pin-date > .ecl-load-label {
    display: block; margin-bottom: 2px; font-size: 11px; font-weight: 400; line-height: 1.3;
}
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-pin-date { font-variant-numeric: tabular-nums; line-height: 1.4; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track {
    display: grid; grid-template-columns: minmax(42px, max-content) 32px minmax(42px, max-content);
    justify-content: start; align-items: start; gap: 6px; width: auto; max-width: 100%; margin: 8px 0 3px;
}
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-bar { width: 32px; min-width: 0; margin-top: 11px; height: 1px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-dot { width: 24px; height: 24px; font-size: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-meta { font-size: 11px; line-height: 1.35; max-width: 98px; overflow-wrap: anywhere; margin-top: 3px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-dot.is-pending { background: #dce5f0; color: #6c819c; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-dot.is-ok { background: #e1f0e9; color: #277558; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-dot.is-late { background: #f8e2e5; color: #a83f50; }
body.centrum-internal #contenedor_principal table.ecl-load-table tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-pickup) {
    background: #f0f5fc; border-radius: 5px; padding: 8px !important;
}
body.centrum-internal #contenedor_principal table.ecl-load-table tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-delivery) {
    background: #fbf6ef; border-radius: 5px; padding: 8px !important;
}
@media (min-width: 1101px) {
body.centrum-internal #contenedor_principal table.ecl-load-table tbody > tr:has(> td .ecl-load-identity) > td:has(> .ecl-load-delivery) { margin-top: 6px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-pin-body { grid-template-columns: minmax(0,1fr) minmax(130px,.65fr); gap: 3px 8px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-pin-date { white-space: normal; }
}

/* Detalle ampliado bajo la oferta: presentación común, sin cambiar datos ni AJAX. */
body.centrum-internal #contenedor_principal .detail-row .detail-content {
    padding: 16px !important; background: #f1f4fb !important;
    border: 1px solid var(--ecl-line); border-top: 0; border-radius: 0 0 8px 8px;
}
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-compact {
    display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; padding: 0;
    background: transparent; border-radius: 0; min-width: 0; font-size: 12px;
}
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-sec { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; min-width: 0; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-work { order: 1; grid-column: 1; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-carrier { order: 2; grid-column: 2; border-left: 1px solid var(--ecl-line); padding-left: 16px; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points { order: 3; grid-column: 1 / -1; background: transparent; border: 0; padding: 0; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-title {
    display: flex; align-items: center; gap: 6px; margin: 0 0 10px; padding-bottom: 7px;
    font-size: 13px; line-height: 1.4; font-weight: 600; color: var(--ecl-ink);
    border-bottom: 1px solid var(--ecl-line); text-transform: none; letter-spacing: 0;
}
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-title > i { margin: 0; color: var(--ecl-blue-500); font-size: 13px; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-grid { gap: 10px 12px; min-width: 0; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-grid.cols-4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-grid.cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-label { color: var(--ecl-mute); font-size: 11px; font-weight: 400; text-transform: none; letter-spacing: 0; margin-bottom: 3px; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-value { color: var(--ecl-ink); font-size: 12px; font-weight: 400; overflow-wrap: anywhere; min-width: 0; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-value.big { color: var(--ecl-ink); font-size: 14px; font-weight: 600; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-badges { gap: 5px; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-badge.active { background: #e8eeff; color: var(--ecl-blue-700); border: 1px solid #cbdcff; border-radius: 4px; font-size: 11px; padding: 2px 7px; font-weight: 500; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points > .ecl-ro-grid > div { min-width: 0; border: 1px solid #dce5ef; border-top: 2px solid var(--ecl-blue-300); border-radius: 6px; padding: 10px 12px; background: #fff; overflow-x: auto; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points > .ecl-ro-grid > div + div { border-top-color: var(--ecl-orange-500); }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points > .ecl-ro-grid > div > div { font-size: 12px !important; color: var(--ecl-blue-700) !important; margin-bottom: 8px !important; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points > .ecl-ro-grid > div + div > div { color: #a84400 !important; }
/* Estas tablas interiores mantienen su semántica y distribución de tabla. */
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row table.ecl-ro-table { display: table; width: 100%; min-width: 0; border-collapse: collapse; margin: 0; font-size: 12px !important; background: #fff; box-shadow: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table thead { display: table-header-group; background: transparent !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table tbody { display: table-row-group; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table :is(thead,tbody) tr { display: table-row; padding: 0; margin: 0; background: #fff; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table :is(th,td) { display: table-cell; min-width: 0; border: 0 !important; border-radius: 0; background: transparent !important; box-shadow: none; overflow-wrap: anywhere; text-align: left !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table thead th { color: var(--ecl-mute) !important; font-size: 11px !important; font-weight: 500; padding: 0 8px 6px 0 !important; white-space: normal; }
body.centrum-internal #contenedor_principal table.ecl-load-table .detail-row .ecl-ro-table tbody td { color: var(--ecl-ink); font-size: 12px !important; padding: 8px 8px 8px 0 !important; border-top: 1px solid #edf1f5 !important; vertical-align: top; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-compact:not(:has(>.ecl-ro-carrier)) .ecl-ro-work { grid-column: 1 / -1; }
@media (max-width: 767.98px) {
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-compact { grid-template-columns: minmax(0,1fr); }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-carrier { grid-column: 1; border-left: 0; border-top: 1px solid var(--ecl-line); padding: 12px 0 0; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-grid:is(.cols-4,.cols-2) { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-points > .ecl-ro-grid.cols-2 { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 479.98px) {
body.centrum-internal #contenedor_principal .detail-row .detail-content { padding: 9px !important; }
body.centrum-internal #contenedor_principal .detail-row .ecl-ro-grid.cols-4 { grid-template-columns: minmax(0,1fr); }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track { grid-template-columns: minmax(36px,max-content) 24px minmax(36px,max-content); gap: 4px; }
body.centrum-internal #contenedor_principal table.ecl-load-table .ecl-track-bar { width: 24px; }
}
/* Interior aprobado: azul eléctrico y mandarina, toda la información visible. */
body.centrum-internal {
    --ecl-blue-900: #06133a; --ecl-blue-500: #1749d8; --ecl-orange-500: #ff7a00;
    --ecl-bg: #eef3ff; --ecl-ink: #06133a; --ecl-mute: #50617e; --ecl-line: #dce4f5;
    --ecl-paper: #ffffff; --ecl-soft: #e4ecff; --ecl-warm: #fff3e3;
    --ecl-grad-blue: linear-gradient(110deg,var(--ecl-blue-500),#245ce8);
}
body.centrum-internal #contenedor_principal { background: var(--ecl-bg); }
body.centrum-internal .ecl-sidebar { background: var(--ecl-blue-900); }
body.centrum-internal .ecl-nav-link.active { background: var(--ecl-blue-500); }
body.centrum-internal .ecl-page { background: var(--ecl-bg); }
body.centrum-internal :is(.ecl-card,.ecl-accounting-card) { background: var(--ecl-paper); }
body.centrum-internal #contenedor_principal :is(.card,.card-body) { background: var(--ecl-paper); }
body.centrum-internal #contenedor_principal .card-header { background: var(--ecl-soft); }
body.centrum-internal .ecl-sidebar-nav { gap: 2px; }
body.centrum-internal .ecl-nav-link { padding-top: 7px; padding-bottom: 7px; }
body.centrum-internal .ecl-nav-heading { margin-top: 12px; }


body.centrum-internal :is(#contenedor_principal,.modal) .btn-primary { background-color: var(--ecl-blue-500); border-color: var(--ecl-blue-500); }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-btn--orange { background: var(--ecl-orange-500); color: var(--ecl-blue-900); }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-btn--blue { background: var(--ecl-blue-500); color: #fff; }
body.centrum-internal :is(#contenedor_principal,.modal) :is(.btn,.ecl-btn).ecl-btn:not(.btn-link) { border-radius: 24px !important; }
body.centrum-internal #contenedor_principal .ecl-load-table thead th { background: var(--ecl-soft) !important; color: var(--ecl-ink) !important; }
body.centrum-internal #contenedor_principal .ecl-load-table tbody>tr:has(>td .ecl-load-identity) { background-color: var(--ecl-paper); }

/* Una sola distribución de cargas, reutilizando las celdas que recibe DataTables. */
body.centrum-internal #contenedor_principal .ecl-cargas-page > .ecl-toolbar { justify-content: flex-end; margin: 0 0 8px !important; }
body.centrum-internal #contenedor_principal .ecl-cargas-page > .mt-5 { margin-top: 10px !important; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .ecl-actions { gap: 6px; margin: 8px 0 !important; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .nav-tabs { gap: 4px; border: 0; padding-bottom: 8px; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .nav-tabs .nav-link { border: 1px solid var(--ecl-line); border-radius: 5px; padding: 5px 8px; background: var(--ecl-paper); color: var(--ecl-ink); font-size: 12px; line-height: 1.4; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .nav-tabs .nav-link.active { background: var(--ecl-blue-500); border-color: var(--ecl-blue-500); color: #fff; font-weight: 500; }
body.centrum-internal #contenedor_principal .ecl-cargas-page :is(.dt-search,.dt-length) { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-search { width: 100%; }
body.centrum-internal #contenedor_principal .ecl-cargas-page :is(.dt-search input,.dt-length select) { border: 1px solid var(--ecl-line); background: var(--ecl-paper); border-radius: 5px; padding: 6px 8px; font-size: 12px; color: var(--ecl-ink); margin: 0; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-search input { width: 100%; min-width: 0; }
body.centrum-internal #contenedor_principal .ecl-cargas-page :is(input,select):focus-visible { outline: 2px solid var(--ecl-blue-300); outline-offset: 2px; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-layout-row:has(> .dt-layout-cell .dt-search) { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; margin: 9px 0 5px; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-layout-cell:has(.dt-search) { grid-column: 1; grid-row: 1; width: 100%; }
body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-layout-cell:has(.dt-length) { grid-column: 2; grid-row: 1; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table thead th { font-size: 11px !important; font-weight: 500; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) { grid-template-columns: repeat(24,minmax(0,1fr)); grid-template-rows: none; gap: 8px; padding: 0 10px; margin: 0 0 14px; border: 1px solid #b5caf1; border-radius: 14px; color: var(--ecl-ink); background: var(--ecl-paper); box-shadow: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)::before { background: var(--ecl-blue-900); border-bottom: 3px solid var(--ecl-orange-500); margin: 0 -10px; border-radius: 13px 13px 0 0; min-height: 42px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity):has(.rojo)::before { background: #8b203e; border-bottom-color: #ff8499; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td { display: block; min-width: 0; margin: 0; background: var(--ecl-paper); border: 1px solid var(--ecl-line) !important; border-radius: 9px; padding: 8px 9px !important; font-size: 12px !important; color: var(--ecl-ink); box-shadow: none !important; text-align: left !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-identity) { grid-column: 1 / 13; grid-row: 1; background: transparent; border: 0 !important; padding: 8px 0 !important; color: #fff !important; font-weight: 600; font-size: 14px !important; align-self: center; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-identity { color: #fff; white-space: normal; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-offer-caption { color: inherit; font-size: 12px; font-weight: 500; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-state { display: inline-block; white-space: normal; overflow-wrap: anywhere; margin-left: 6px; padding: 2px 6px; border-radius: 4px; font-size: 11px; font-weight: 400; color: var(--ecl-blue-700); background: #dce7ff; vertical-align: middle; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-state:is(.is-publicada,.is-reservada,.is-pendiente_aceptacion_transportista) { background: #ffd3a6; color: #783500; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-state.is-rechazada_transportista { background: #ffe9ed; color: #ae2945; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-sale-date) { grid-column: 13 / -1; grid-row: 1; padding: 8px 38px 8px 0 !important; background: transparent; border: 0 !important; color: #dce7ff; font-size: 11px !important; text-align: right !important; align-self: center; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-sale-date :is(.ecl-load-cell-label,.ecl-load-label) { display: inline; font-size: 11px; color: #dce7ff; margin-right: 5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-pickup) { grid-column: 1 / 13; grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-delivery) { grid-column: 13 / -1; grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table :is(.ecl-load-pickup,.ecl-load-delivery) > .ecl-load-cell-label { padding: 6px 9px; margin: -8px -9px 8px; border-radius: 8px 8px 0 0; font-size: 11px; font-weight: 500; letter-spacing: 0; color: #fff; background: var(--ecl-blue-500); }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-delivery > .ecl-load-cell-label { color: var(--ecl-blue-900); background: #ffd3a6; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-prices) { grid-column: 1 / -1; grid-row: 3; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px 0; padding: 0 9px 8px !important; background: #f0f4ff; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-prices>.ecl-load-cell-label { grid-column: 1 / -1; order: 0; padding: 6px 9px; margin: 0 -9px; border-radius: 8px 8px 0 0; background: var(--ecl-blue-900); color: #fff; text-align: left; font-size: 11px; letter-spacing: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table :is(.ecl-price-buy,.ecl-price-sale,.ecl-price-benefit,.ecl-price-km-wrap) { min-width: 0; margin: 0; padding: 0 9px; border: 0; border-left: 1px solid var(--ecl-line); text-align: left; font-size: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-buy { order: 1; border-left: 0; padding-left: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-sale { order: 2; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-benefit { order: 3; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-km-wrap { order: 4; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table :is(.ecl-price-label,.ecl-price-km) { display: block; font-size: 11px; font-weight: 400; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-amount,body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-price-sale>strong { display: block; font-size: 18px; font-weight: 500 !important; line-height: 1.35; color: var(--ecl-ink); }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table :is(.ecl-price-buy,.ecl-price-sale,.ecl-price-benefit,.ecl-price-km-wrap)>br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-client) { grid-column: 1 / 13; grid-row: 4; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-carrier) { grid-column: 13 / -1; grid-row: 4; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-mini-card { padding: 0; border: 0; background: transparent; box-shadow: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-mini-head { color: var(--ecl-blue-700); background: var(--ecl-soft); padding: 6px 9px; margin: -8px -9px 6px; border-radius: 8px 8px 0 0; font-size: 11px; font-weight: 500; text-transform: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-mini-head .ecl-mini-ic { width: 19px; height: 19px; font-size: 12px; border-radius: 4px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-kv-row { display: grid; grid-template-columns: minmax(80px,.3fr) minmax(0,1fr); gap: 7px; padding: 2px 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-kv-k { display: inline; margin: 0; font-size: 11px; font-weight: 400; color: var(--ecl-mute); text-transform: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-kv-v { font-size: 12px; line-height: 1.4; color: var(--ecl-ink); overflow-wrap: anywhere; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin { margin-bottom: 8px; padding: 0; gap: 8px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin:last-child { margin-bottom: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-body { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 0 7px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-body > :is(.ecl-track,.ecl-pin-inci,a) { grid-column: 1 / -1; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-place { grid-column: 1 / -1; margin: 0 0 5px; color: var(--ecl-ink); font-size: 16px; line-height: 1.3; font-weight: 500; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-country { display: block; color: var(--ecl-mute); font-size: 11px; font-weight: 400; margin-bottom: 2px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-cp { color: var(--ecl-mute); font-size: 11px; font-weight: 400; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-chips { grid-column: 1 / -1; margin: 0 0 5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-chip-data { background: var(--ecl-soft); border-color: var(--ecl-line); color: var(--ecl-ink); font-size: 11px; padding: 2px 5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-date { background: #eef3ff; border-radius: 5px; margin: 2px 0; padding: 5px 6px; text-align: left; color: var(--ecl-ink); font-size: 12px; line-height: 1.4; font-variant-numeric: tabular-nums; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-pin-date>.ecl-load-label { display: block; margin-bottom: 2px; color: var(--ecl-mute); font-size: 11px; font-weight: 400; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-track { margin: 7px 0 3px; padding: 5px 7px; background: var(--ecl-warm); border: 1px solid #f0d2af; border-radius: 6px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-track-meta { font-size: 11px; line-height: 1.4; white-space: normal; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-metrics) { grid-column: 1 / -1; grid-row: 5; background: var(--ecl-soft); padding: 7px 9px !important; font-size: 12px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-metrics>.ecl-load-cell-label { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-metrics :is(.ecl-metric-row,.ecl-chips-top) { display: inline-flex; align-items: center; gap: 5px; margin: 0 14px 0 0; font-size: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-metrics>br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-metrics>b { margin-right: 12px; font-weight: 500; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-comments) { grid-column: 1 / -1; grid-row: 6; padding: 7px 9px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-comments>.ecl-load-cell-label { display: inline; margin: 0 7px 0 0; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-actions) { grid-column: 1 / -1; grid-row: 7; background: transparent; border: 0 !important; padding: 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 0; border: 0; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation>br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation:empty { display: none; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation .ecl-load-box { width: 100%; min-width: 0; margin: 0; padding: 7px 9px !important; border: 1px solid var(--ecl-line); border-radius: 8px; background: var(--ecl-paper); font-size: 12px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation .ecl-load-box legend { float: none; line-height: 1.4; color: var(--ecl-mute); font-size: 11px !important; padding: 0 4px !important; margin: 0 0 5px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-internal-notes { grid-column: 2; grid-row: 1 / span 2; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation>.ecl-load-internal-notes:only-of-type { grid-column: 1 / -1; grid-row: auto; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-internal-notes .inline-list { width: 100%; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-internal-notes input[type=submit] { white-space: nowrap; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .formulario_anotaciones { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .formulario_anotaciones textarea { width: 100% !important; height: 48px; min-height: 48px; font-size: 12px; flex: 1 1 180px; border: 1px solid var(--ecl-line); border-radius: 5px; padding: 5px 7px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .formulario_anotaciones input[type=submit] { color: var(--ecl-blue-900) !important; background: var(--ecl-orange-500) !important; border-color: var(--ecl-orange-500) !important; border-radius: 24px !important; font-size: 12px !important; padding: 6px 10px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-document-download { color: var(--ecl-blue-500) !important; background: #dce7ff !important; border-color: #b5caf1 !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-document-upload { color: #a84400 !important; background: #ffd3a6 !important; border-color: #ffb56c !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-actions>.ecl-menu .ecl-menu-btn { background: #153c83; color: #fff; border-color: #5576b5; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) > td:has(>.ecl-load-audit) { grid-column: 1 / -1; grid-row: 8; padding: 7px 10px !important; margin: 0 -10px; border: 0 !important; border-top: 1px solid #ddd5c8 !important; border-radius: 0 0 13px 13px; background: #f3ebdd; font-size: 11px !important; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-audit>.ecl-load-cell-label { display: inline; margin: 0 5px 0 0; font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-audit strong { font-size: 11px; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity):not(:has(.ecl-load-client))>td:has(>.ecl-load-carrier) { grid-column: 1 / -1; }
body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity):not(:has(.ecl-price-amount))>td:has(>.ecl-load-prices) { grid-template-columns: repeat(3,minmax(0,1fr)); }
@media(max-width:767.98px) {
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity) { gap: 8px; padding: 0 8px; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)::before { margin: 0 -8px; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:is(:has(>.ecl-load-pickup),:has(>.ecl-load-delivery),:has(>.ecl-load-client),:has(>.ecl-load-carrier)) { grid-column: 1 / -1; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-pickup) { grid-row: 2; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-delivery) { grid-row: 3; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-prices) { grid-row: 4; grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-client) { grid-row: 5; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-carrier) { grid-row: 6; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-metrics) { grid-row: 7; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-comments) { grid-row: 8; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-actions) { grid-row: 9; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-audit) { grid-row: 10; margin: 0 -8px; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-documentation { grid-template-columns: minmax(0,1fr); }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-internal-notes { grid-column: 1; grid-row: auto; }
    body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-layout-row:has(> .dt-layout-cell .dt-search) { grid-template-columns: minmax(0,1fr); gap: 8px; }
    body.centrum-internal #contenedor_principal .ecl-cargas-page .dt-layout-cell:has(.dt-length) { grid-column: 1; grid-row: 2; }
}
@media(max-width:479.98px) {
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-identity) { grid-column: 1 / -1; padding-right: 34px !important; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-sale-date) { grid-column: 1 / -1; grid-row: 2; padding: 5px 0 !important; text-align: left !important; color: var(--ecl-mute); }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table .ecl-load-sale-date :is(.ecl-load-cell-label,.ecl-load-label) { color: var(--ecl-mute); }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-pickup) { grid-row: 3; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-delivery) { grid-row: 4; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-prices) { grid-row: 5; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity):not(:has(.ecl-price-amount))>td:has(>.ecl-load-prices) { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-client) { grid-row: 6; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-carrier) { grid-row: 7; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-metrics) { grid-row: 8; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-comments) { grid-row: 9; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-actions) { grid-row: 10; }
    body.centrum-internal #contenedor_principal table.ecl-load-table.ecl-cargas-table tbody > tr:has(>td .ecl-load-identity)>td:has(>.ecl-load-audit) { grid-row: 11; }
}

/* Lista resumida y detalle lateral aprobados. Sin JS se conserva la ficha anterior. */
body.centrum-internal #contenedor_principal .ecl-md-workspace { display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; align-items: start; }
body.centrum-internal #contenedor_principal .ecl-md-workspace.ecl-md-has-detail { grid-template-columns: minmax(0,1fr) 320px; }
body.centrum-internal #contenedor_principal .ecl-md-main { min-width: 0; container-type: inline-size; }
body.centrum-internal #contenedor_principal .ecl-md-main > .dt-layout-table { margin: 0; }
body.centrum-internal #contenedor_principal .ecl-md-main .dt-layout-cell { display: block; width: 100%; }
body.centrum-internal #contenedor_principal .ecl-md-toolbar { display: flex; justify-content: flex-end; padding: 0 0 8px; }
body.centrum-internal #contenedor_principal .ecl-md-toolbar label { display: inline-flex; flex-direction: row; align-items: center; gap: 7px; font-size: 11px !important; color: var(--ecl-mute); margin: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-md-toolbar select { max-width: min(260px,65vw); border: 1px solid var(--ecl-line); background: var(--ecl-paper); color: var(--ecl-ink); border-radius: 5px; padding: 5px 7px; font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-md-listhead { display: grid; grid-template-columns: var(--ecl-md-columns); align-items: center; padding: 8px 7px; gap: 10px; border-bottom: 1px solid var(--ecl-blue-500); background: var(--ecl-soft); color: var(--ecl-ink); font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-md-head-price { text-align: left; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready { width: 100% !important; margin: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody { display: block; width: 100%; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr:has(.ecl-load-identity) { display: grid; grid-template-columns: var(--ecl-md-columns); grid-template-rows: auto; gap: 10px; position: relative; padding: 0 7px; margin: 0; border: 0; border-bottom: 1px solid #e1e5eb; border-radius: 0; box-shadow: none; background: var(--ecl-paper) !important; isolation: auto; min-height: 70px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr::before { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr.ecl-md-late { background: #fff0f3 !important; box-shadow: inset 3px 0 #c92f4f; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr.ecl-md-selected { background: #edf2ff !important; box-shadow: inset 3px 0 var(--ecl-blue-500); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td:not(.ecl-md-column) { display: none !important; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td.ecl-md-column { display: block !important; grid-column: var(--ecl-md-column) !important; grid-row: 1 !important; order: var(--ecl-md-column); align-self: start; width: auto !important; max-width: none; min-width: 0; margin: 0 !important; padding: 10px 0 !important; border: 0 !important; border-radius: 0; background: transparent !important; box-shadow: none !important; font-size: 12px !important; color: var(--ecl-ink) !important; text-align: left !important; line-height: 1.45; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-load-cell { display: none !important; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary { display: block; min-width: 0; overflow-wrap: anywhere; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select { display: block; width: 100%; border: 0; border-radius: 0; padding: 0; margin: 0; background: transparent; color: var(--ecl-ink); text-align: left; line-height: 1.45; font-size: 12px; font-weight: 400; white-space: normal; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select strong { display: block; font-size: 13px; font-weight: 600; color: var(--ecl-ink); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select span { display: block; color: var(--ecl-mute); font-size: 12px; margin-top: 1px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select small { display: block; font-size: 11px; color: #65758c; margin-top: 4px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready td[data-ecl-md-column=date] .ecl-md-summary { color: var(--ecl-mute); font-size: 11px; font-variant-numeric: tabular-nums; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready td[data-ecl-md-column=date] small { display: block; font-size: 11px; color: var(--ecl-ink); margin-top: 2px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready td[data-ecl-md-column=client] .ecl-md-summary { color: var(--ecl-mute); font-size: 12px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready td[data-ecl-md-column=price] .ecl-md-summary { text-align: left; font-size: 12px; white-space: normal; font-variant-numeric: tabular-nums; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-state { color: #206944; font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-state:is(.is-reservada,.is-pendiente_aceptacion_transportista) { color: #8b5400; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-state.is-publicada { color: var(--ecl-blue-500); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-state.is-rechazada_transportista { color: #b33149; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr:has(>td.dt-empty) { display: block; background: var(--ecl-paper); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td.dt-empty { display: block !important; width: 100%; padding: 15px !important; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select:focus-visible { outline: 2px solid var(--ecl-blue-500); outline-offset: 3px; }
body.centrum-internal #contenedor_principal .ecl-md-detail { min-width: 0; padding: 0 0 0 15px; border-left: 1px solid #c7d0dc; background: var(--ecl-paper); color: var(--ecl-ink); }
body.centrum-internal #contenedor_principal .ecl-md-detail[hidden] { display: none !important; }
body.centrum-internal #contenedor_principal .ecl-md-detailhead { display: flex; align-items: center; gap: 7px; padding: 4px 0 10px; }
body.centrum-internal #contenedor_principal .ecl-md-detailhead > div:first-child { flex: 1; min-width: 0; }
body.centrum-internal #contenedor_principal .ecl-md-detailhead small { display: block; font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-detailhead h2 { font-size: 16px !important; color: var(--ecl-blue-700); font-weight: 600; margin: 3px 0 0; }
body.centrum-internal #contenedor_principal .ecl-md-close { border: 0; background: transparent; color: var(--ecl-mute); font-size: 24px; line-height: 1; padding: 3px 5px; min-width: 30px; min-height: 30px; }
body.centrum-internal #contenedor_principal .ecl-md-detailroute { font-size: 15px; font-weight: 600; line-height: 1.4; margin: 0 0 13px; overflow-wrap: anywhere; }
body.centrum-internal #contenedor_principal .ecl-md-finance > .ecl-load-prices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 12px; margin-bottom: 12px; }
body.centrum-internal #contenedor_principal .ecl-md-finance[hidden] { display: none !important; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-load-cell-label { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-finance :is(.ecl-price-buy,.ecl-price-sale,.ecl-price-benefit,.ecl-price-km-wrap) { margin: 0; min-width: 0; font-size: 12px; line-height: 1.5; }
body.centrum-internal #contenedor_principal .ecl-md-finance br { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-label { display: block; font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-finance :is(.ecl-price-amount,.ecl-price-sale > strong) { display: block; font-weight: 600 !important; color: var(--ecl-blue-700); font-size: 16px; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-benefit { color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-benefit > span:not(.ecl-number) { display: block; font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-km { font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-tabs { display: flex; gap: 0; border-bottom: 1px solid #c7d0dc; margin-bottom: 12px; flex-wrap: wrap; }
body.centrum-internal #contenedor_principal .ecl-md-tab { padding: 7px 5px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--ecl-mute); font-size: 11px; font-weight: 400; }
body.centrum-internal #contenedor_principal .ecl-md-tab[aria-selected=true] { color: var(--ecl-blue-500); border-bottom-color: var(--ecl-blue-500); font-weight: 600; }
body.centrum-internal #contenedor_principal .ecl-md-tab[hidden],body.centrum-internal #contenedor_principal .ecl-md-tabpanel[hidden] { display: none !important; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel > .ecl-load-cell { display: block; margin-bottom: 13px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel > .ecl-load-cell + .ecl-load-cell { padding-top: 11px; border-top: 1px solid #e1e5eb; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-cell-label { display: block; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .4px; color: var(--ecl-mute); margin-bottom: 7px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin { display: flex; gap: 8px; margin: 0 0 12px; padding: 0; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-body { display: block; min-width: 0; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-place { font-size: 14px; line-height: 1.4; margin: 0 0 5px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-country { font-size: 11px; font-weight: 400; display: block; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-cp { font-size: 11px; font-weight: 400; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-chips { margin: 5px 0 7px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-chip-data { font-size: 11px; padding: 2px 5px; background: transparent; border-color: var(--ecl-line); color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-date { display: block; text-align: left; font-size: 12px; margin: 0 0 6px; color: var(--ecl-ink); line-height: 1.5; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-date > .ecl-load-label { display: block; font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-track { margin: 8px 0; padding: 0; max-width: 100%; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-track-meta { font-size: 11px; white-space: normal; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-pin-file { overflow-wrap: anywhere; font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-metrics { font-size: 12px; line-height: 1.7; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-metric-row { margin-bottom: 5px; font-size: 12px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-mini-card { background: transparent; border: 0; padding: 0; border-radius: 0; box-shadow: none; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-mini-head { font-size: 11px; font-weight: 500; color: var(--ecl-mute); margin-bottom: 8px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-kv-row { display: grid; grid-template-columns: 74px minmax(0,1fr); gap: 4px 7px; padding: 3px 0; font-size: 12px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-kv-k { flex: none; font-size: 11px; font-weight: 400; text-transform: none; color: var(--ecl-mute); padding: 0; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-kv-v { min-width: 0; font-size: 12px; color: var(--ecl-ink); overflow-wrap: anywhere; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-documentation { display: block; padding: 0; border: 0; background: transparent; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-box { display: block; width: 100%; min-width: 0; border: 0; padding: 8px 0 !important; margin: 0 0 10px; font-size: 12px; overflow-wrap: anywhere; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-box legend { font-size: 11px !important; color: var(--ecl-mute); float: none; padding: 0 !important; margin-bottom: 7px; line-height: 1.5; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-box > br { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .formulario_anotaciones { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .formulario_anotaciones > br { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .formulario_anotaciones textarea { width: 100% !important; min-width: 0; min-height: 90px; font-size: 12px; padding: 8px; background: var(--ecl-paper); color: var(--ecl-ink); border: 1px solid var(--ecl-line); border-radius: 5px; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .formulario_anotaciones > div { justify-content: flex-end; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-audit { font-size: 11px; color: var(--ecl-mute); line-height: 1.7; }
body.centrum-internal #contenedor_principal .ecl-md-tabpanel .ecl-load-comments { font-size: 12px; line-height: 1.65; }
body.centrum-internal #contenedor_principal .ecl-md-empty { font-size: 12px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-full { border: 1px solid var(--ecl-line); background: transparent; color: var(--ecl-blue-500); border-radius: 5px; padding: 6px 9px; font-size: 11px; }





@media(max-width:1100px) {
    body.centrum-internal #contenedor_principal .ecl-md-workspace.ecl-md-has-detail { grid-template-columns: minmax(0,1fr); }
    body.centrum-internal #contenedor_principal .ecl-md-detail { border-left: 0; border-top: 2px solid #c7d0dc; padding: 12px 0 0; }
}
@media(pointer:coarse) {
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select { min-height: 44px; }
    body.centrum-internal #contenedor_principal .ecl-md-tab { min-height: 44px; }
    body.centrum-internal #contenedor_principal .ecl-md-close { min-width: 44px; min-height: 44px; }
    body.centrum-internal #contenedor_principal .ecl-md-tabpanel textarea { font-size: 16px; }
}


body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-buy { order: 1; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-sale { order: 2; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-benefit { order: 3; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-km-wrap { order: 4; }
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-buy:not(:has(.ecl-price-amount)),
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-benefit:not(:has(span)),
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-sale:not(:has(strong,.ecl-price-label)),
body.centrum-internal #contenedor_principal .ecl-md-finance .ecl-price-km-wrap:not(:has(.ecl-price-km)) { display: none; }

/* Variantes aprobadas: reutilizan la familia de ofertas y formularios compactos. */
body.centrum-internal .modal:has(.ecl-vehicle-offer) > .modal-dialog { width: calc(100% - 40px) !important; max-width: 1100px !important; }
body.centrum-internal .ecl-vehicle-offer #detalles_trabajo { margin: 0; }
body.centrum-internal .ecl-vehicle-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
body.centrum-internal .modal .ecl-vehicle-offer .ecl-vehicle-panel { margin: 0; padding: 12px; border: 1px solid #dde5ef; border-radius: 7px; box-shadow: none; min-width: 0; }
body.centrum-internal .ecl-vehicle-panel.ecl-vehicle-load { border-top: 2px solid #7898bc !important; }
body.centrum-internal .ecl-vehicle-panel.ecl-vehicle-unload { border-top: 2px solid #d4aa74 !important; }
body.centrum-internal .ecl-vehicle-panel:is(.ecl-vehicle-capacity,.ecl-vehicle-owner,.ecl-vehicle-agent) { grid-column: 1 / -1; }
body.centrum-internal .modal-body .ecl-vehicle-offer .title { display: flex; align-items: center; gap: 7px; padding: 0 0 8px; margin: 0 0 10px !important; text-align: left; }
body.centrum-internal .modal-body .ecl-vehicle-offer .title h3 { font-size: 12px !important; font-weight: 600 !important; margin: 0; color: #456784 !important; }


body.centrum-internal .ecl-vehicle-offer .form-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 12px; padding: 0; margin: 0; }
body.centrum-internal .ecl-vehicle-offer .form-row > div { width: auto; max-width: none; padding: 0; margin: 0; min-width: 0; }
body.centrum-internal .ecl-vehicle-offer .form-group:has(select[multiple][id^="paises_"]) { grid-column: 1 / -1; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-capacity .form-row { grid-template-columns: 2fr 1fr 1fr; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-owner .form-row { grid-template-columns: 1fr 2fr; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-agent .form-row { grid-template-columns: minmax(0,1fr); }
body.centrum-internal .modal-body .ecl-vehicle-offer label { font-size: 11px !important; color: var(--ecl-mute); font-weight: 500 !important; margin: 0 0 4px; }
body.centrum-internal .modal-body .ecl-vehicle-offer :is(input.form-control,.bootstrap-select>.dropdown-toggle) { min-height: 31px !important; height: 31px !important; padding: 5px 8px !important; font-size: 12px !important; border-radius: 5px !important; }
body.centrum-internal .ecl-vehicle-offer .bootstrap-select { width: 100% !important; max-width: 100%; min-width: 0; height: auto !important; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-submit { margin: 13px 0 0 !important; padding: 11px 0 0; width: 100%; border-top: 1px solid #dce5ef; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-submit .form-group { margin: 0 !important; padding: 0; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-submit .text-center { text-align: right !important; }
body.centrum-internal .modal .modal-body .ecl-vehicle-offer input#boton_enviar.btn { background: var(--ecl-orange-500) !important; border-color: var(--ecl-orange-500) !important; color: var(--ecl-blue-900) !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) { grid-template-columns: repeat(24,minmax(0,1fr)); gap: 0 12px; padding: 0 14px 14px; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-identity { grid-column: 1 / 10; grid-row: 1; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-sale-date { grid-column: 10 / 23; grid-row: 1; padding-right: 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-actions { grid-column: 23 / -1; grid-row: 1; padding: 7px 0 !important; align-self: center; text-align: right !important; background: transparent; white-space: nowrap; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-pickup { grid-column: 1 / 7; grid-row: 2 / 4; margin-top: 14px; background: #f1f6fc; border-top: 2px solid #7e9ebd !important; padding: 10px !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-delivery { grid-column: 7 / 13; grid-row: 2 / 4; margin-top: 14px; background: #fcf7ef; border-top: 2px solid #d1ab77 !important; padding: 10px !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-client { grid-column: 13 / 19; grid-row: 2; margin-top: 14px; border: 0 !important; border-left: 1px solid #e6ecf4 !important; padding: 0 0 9px 12px !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-carrier { grid-column: 13 / 19; grid-row: 3; border: 0 !important; border-left: 1px solid #e6ecf4 !important; padding: 9px 0 0 12px !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-metrics { grid-column: 19 / -1; grid-row: 2; margin-top: 14px; border: 0 !important; border-left: 1px solid #e6ecf4 !important; background: #fff; padding: 0 0 9px 12px !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-weight { grid-column: 19 / 22; grid-row: 3; padding: 7px 9px !important; background: #f6f8fb; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-length { grid-column: 22 / -1; grid-row: 3; padding: 7px 9px !important; background: #f6f8fb; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:not(:has(.ecl-load-client)) > td.ecl-load-carrier { grid-row: 2 / 4; margin-top: 14px; padding-top: 0 !important; }
body.centrum-internal .ecl-vehicle-table .ecl-country-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 7px; margin: 0 5px 6px 0; max-width: 100%; background: #fff; border: 1px solid #dce5ef; border-radius: 5px; font-size: 11px; white-space: normal; }
body.centrum-internal .ecl-vehicle-table .ecl-country-chip img { width: 23px; height: 15px; flex: 0 0 23px; object-fit: cover; border: 1px solid #183b6320; border-radius: 2px; }
body.centrum-internal .ecl-vehicle-table :is(.ecl-load-pickup,.ecl-load-delivery)>.ecl-load-cell-label { display: block !important; margin-bottom: 7px; }
body.centrum-internal .ecl-vehicle-date { display: block; margin-top: 5px; font-size: 10.5px; font-weight: 500; color: #4b6e92; }
body.centrum-internal .ecl-vehicle-date-end { display: block; font-size: 11px; color: var(--ecl-mute); margin-top: 2px; }
body.centrum-internal .ecl-vehicle-table td:is(.ecl-load-pickup,.ecl-load-delivery) br { display: none; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table .ecl-load-actions .ecl-act { display: inline-grid; place-items: center; width: 27px; height: 26px; min-height: 26px; font-size: 11px !important; margin: 0 0 0 4px !important; padding: 4px !important; }
/* El listado compartido conserva su tabla convencional fuera de documentación. */
body.centrum-internal .ecl-docs-update-label { display: none; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table > tbody > tr:has(>td .ecl-load-identity) { grid-template-columns: repeat(24,minmax(0,1fr)); gap: 0; padding: 0 14px; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table > tbody > tr:has(>td .ecl-load-identity)::before { background: #f7f9fd; border-bottom: 1px solid #e0e8f2; min-height: 53px; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table > tbody > tr:has(>td .ecl-load-identity) > td { background: transparent; border: 0 !important; border-radius: 0; padding: 12px !important; color: #7189a4; font-size: 10.5px !important; min-width: 0; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-identity { grid-column: 1 / 2; grid-row: 1; color: var(--ecl-mute) !important; padding: 12px 0 !important; align-self: center; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table .ecl-load-identity { color: #91a1b6 !important; font-size: 11px; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-company { grid-column: 2 / 18; grid-row: 1; padding: 10px 0 !important; font-size: 11px !important; align-self: center; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table .ecl-docs-company-name { display: block; font-size: 13px; font-weight: 600; color: #33577d; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-company br { display: none; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-company > b:first-child { display: none; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-company > b { margin-right: 4px; font-size: 11px; font-weight: 400; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-actions { grid-column: 18 / -1; grid-row: 1; padding: 10px 0 !important; align-self: center; text-align: right !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-contact { grid-column: 1 / 5; grid-row: 2 / 4; padding-left: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-address { grid-column: 5 / 9; grid-row: 2; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-fiscal { grid-column: 5 / 9; grid-row: 3; padding-top: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-vehicles { grid-column: 9 / 14; grid-row: 2 / 4; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-drivers { grid-column: 14 / 18; grid-row: 2 / 4; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-documents { grid-column: 18 / -1; grid-row: 2 / 4; padding-right: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-modified { grid-column: 1 / -1; grid-row: 4; padding: 7px 14px !important; margin: 0 -14px; border-top: 1px solid #e5ecf4 !important; background: #f8fafd; font-size: 11px !important; color: var(--ecl-mute); border-radius: 0 0 8px 8px; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-file { padding: 8px; border: 1px solid #e0e8f1; border-radius: 5px; background: #f5f8fc; margin: 0 0 8px; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-file > br { display: none; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-file > b { display: block; font-size: 11px; font-weight: 500; color: var(--ecl-mute); margin: 7px 0 0 !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page .ecl-docs-download-btn { width: 100%; min-height: 26px !important; padding: 5px 7px !important; justify-content: center !important; background: #35638d !important; border-color: #35638d !important; color: #fff !important; font-size: 11px !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page button[onclick^="modalGestionarVehiculos"] { background: var(--ecl-blue-500) !important; border-color: var(--ecl-blue-500) !important; color: #fff !important; padding: 5px 8px !important; min-height: 28px !important; font-size: 11px !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page button[onclick^="modalGestionarChoferes"] { background: var(--ecl-blue-700) !important; border-color: var(--ecl-blue-700) !important; color: #fff !important; padding: 5px 8px !important; min-height: 28px !important; font-size: 11px !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page .ecl-docs-update { display: inline-flex; gap: 6px; align-items: center; background: #c68b3f !important; border-color: #c68b3f !important; color: #fff !important; margin: 0 !important; padding: 6px 10px !important; height: auto; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-update-label { display: inline; }
body.centrum-internal .ecl-expired-docs-page .ecl-docs-update > i { font-family: 'Font Awesome 5 Free'; font-weight: 900; margin: 0 !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity):has(.tabla-incidencias) > td.ecl-docs-actions { grid-row: 4; grid-column: 1 / -1; text-align: left !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity):has(.tabla-incidencias) > td.ecl-docs-modified { grid-row: 5; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.tabla-incidencias { display: table; border-collapse: collapse; width: 100%; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.tabla-incidencias > thead { display: table-header-group; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.tabla-incidencias > tbody { display: table-row-group; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.tabla-incidencias tr { display: table-row; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.tabla-incidencias :is(th,td) { display: table-cell; width: auto !important; }
@media (max-width: 1100px) {
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) { grid-template-columns: repeat(12,minmax(0,1fr)); gap: 0 12px; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-identity { grid-column: 1 / 6; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-sale-date { grid-column: 6 / 11; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-actions { grid-column: 11 / -1; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-pickup { grid-column: 1 / 7; grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-delivery { grid-column: 7 / -1; grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-client { grid-column: 1 / 7; grid-row: 3; padding: 9px 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-carrier { grid-column: 7 / -1; grid-row: 3; padding: 9px 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-metrics { grid-column: 1 / 7; grid-row: 4; margin-top: 0; padding-left: 0 !important; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-weight { grid-column: 7 / 10; grid-row: 4; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-length { grid-column: 10 / -1; grid-row: 4; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:not(:has(.ecl-load-client)) > td.ecl-load-carrier { grid-column: 1 / -1; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-contact { grid-column: 1 / 9; grid-row: 2; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-address { grid-column: 9 / 17; grid-row: 2; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-fiscal { grid-column: 17 / -1; grid-row: 2; padding-top: 12px !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-vehicles { grid-column: 1 / 9; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-drivers { grid-column: 9 / 17; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-documents { grid-column: 17 / -1; grid-row: 3; }
}
@media (max-width: 767.98px) {
body.centrum-internal .ecl-vehicle-form-grid { grid-template-columns: minmax(0,1fr); }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-capacity .form-row { grid-template-columns: 2fr 1fr 1fr; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-company { grid-column: 2 / 14; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-actions { grid-column: 14 / -1; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page .ecl-docs-update { white-space: normal; font-size: 11px !important; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-contact { grid-column: 1 / 13; grid-row: 2; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-address { grid-column: 13 / -1; grid-row: 2; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-fiscal { grid-column: 13 / -1; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-vehicles { grid-column: 1 / 13; grid-row: 3; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-drivers { grid-column: 1 / 13; grid-row: 4; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-documents { grid-column: 13 / -1; grid-row: 4; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-docs-modified { grid-row: 5; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity):has(.tabla-incidencias) > td.ecl-docs-actions { grid-row: 5; grid-column: 1 / -1; }
body.centrum-internal #contenedor_principal .ecl-expired-docs-page table.ecl-company-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity):has(.tabla-incidencias) > td.ecl-docs-modified { grid-row: 6; }
}
@media (max-width: 599.98px) {
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-capacity .form-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.centrum-internal .ecl-vehicle-capacity .form-group:has(select) { grid-column: 1 / -1; }
body.centrum-internal .ecl-vehicle-offer .ecl-vehicle-owner .form-row { grid-template-columns: minmax(0,1fr); }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-pickup { grid-column: 1 / -1; grid-row: 2; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-delivery { grid-column: 1 / -1; grid-row: 3; margin-top: 9px; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-client { grid-column: 1 / -1; grid-row: 4; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-carrier { grid-column: 1 / -1; grid-row: 5; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-load-metrics { grid-column: 1 / -1; grid-row: 6; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-weight { grid-column: 1 / 7; grid-row: 7; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:has(>td .ecl-load-identity) > td.ecl-vehicle-length { grid-column: 7 / -1; grid-row: 7; }
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table > tbody > tr:not(:has(.ecl-load-client)) > td.ecl-load-carrier { grid-row: 5; }
}
body.centrum-internal #contenedor_principal table.ecl-vehicle-table.ecl-load-table .ecl-load-metrics > .ecl-load-cell-label { display: block !important; }

/* CENTRUM PUBLIC APPROVED: base externa compartida, limitada a su cuerpo. */

            body.centrum-public {
                --ecl-blue-900:#06133a;
                --ecl-blue-700:#0b2a6b;
                --ecl-blue-500:#1749d8;
                --ecl-blue-300:#5b8cff;
                --ecl-orange-500:#ff7a00;
                --ecl-orange-400:#ff9d2e;
                --ecl-orange-600:#e25a00;
                --ecl-grad-orange:linear-gradient(135deg,#ff9d2e 0%,#e25a00 100%);
                --ecl-grad-blue: linear-gradient(110deg,var(--ecl-blue-500),#245ce8);
            }

            body.centrum-public {
                font-family:'Poppins',sans-serif;
            }

            /* ---------- NAVBAR ---------- */
            body.centrum-public .site-navbar {
                background:var(--ecl-blue-900) !important;
                box-shadow:0 2px 12px -4px rgba(6,19,58,.5);
                border-bottom:3px solid var(--ecl-orange-500);

            }
            /* main.js añade .scrolled/.sleep al hacer scroll; cubrimos ambos */
            body.centrum-public .site-navbar.scrolled,
body.centrum-public .js-site-navbar.scrolled,
body.centrum-public .site-navbar.sleep {
                background:var(--ecl-blue-900) !important;
                box-shadow:0 12px 30px -18px rgba(0,0,0,.8);
            }

            body.centrum-public .site-navbar .site-logo img {
                filter:brightness(0) invert(1);
            }

            body.centrum-public .site-navbar .site-menu > li > a.nav-link {
                color:rgba(255,255,255,.82) !important;
                font-weight:600;
                font-size:.95rem;
                padding:10px 16px !important;
                position:relative;
                transition:color .2s ease;
            }
            body.centrum-public .site-navbar .site-menu > li > a.nav-link:hover,
body.centrum-public .site-navbar .site-menu > li.active > a.nav-link {
                color:#fff !important;
            }
            /* subrayado naranja animado (excepto en los botones resaltados) */
            body.centrum-public .site-navbar .site-menu > li > a.nav-link:not(.resaltar_boton)::after {
                content:"";
                position:absolute;
                left:16px;
                right:16px;
                bottom:4px;
                height:2px;
                background:var(--ecl-grad-orange);
                transform:scaleX(0);
                transform-origin:left;
                transition:transform .25s ease;
            }
            body.centrum-public .site-navbar .site-menu > li > a.nav-link:not(.resaltar_boton):hover::after,
body.centrum-public .site-navbar .site-menu > li.active > a.nav-link:not(.resaltar_boton)::after {
                transform:scaleX(1);
            }

            /* Botones resaltados (Solicitar alta / Login): rediseño naranja y azul */
            body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton {
                border-radius:10px;
                color:#fff !important;
                font-weight:800 !important;
                padding:9px 18px !important;
                margin-left:6px;
                box-shadow:0 10px 22px -12px rgba(0,0,0,.6);
                transition:transform .18s ease, filter .18s ease;
            }
            body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton:hover {
                transform:translateY(-2px);
                filter:brightness(1.08);
            }
            body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton::after {
                display:none;
            }
            /* Forzamos paleta corporativa por encima de los inline rojo/verde */
            body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton[style*="red"] {
                background:var(--ecl-grad-orange) !important;
            }
            body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton[style*="green"] {
                background:var(--ecl-blue-500) !important;
            }

            /* Selector de idioma */


            /* Selector de idioma */
            body.centrum-public .site-navbar .select {
                border-radius:10px !important;
                overflow:visible !important;
                background:rgba(255,255,255,.08) !important;
                color:#fff !important;
                border:1px solid rgba(255,255,255,.16);
                position:relative;
                z-index:10020;
            }

            body.centrum-public .site-navbar .select > div:first-child {
                overflow:hidden;
                border-radius:10px;
            }

            body.centrum-public .site-navbar .select .seleccionador {
                position:absolute;
                top:100%;
                right:0;
                z-index:10030;
                min-width:100%;
            }

            /* Botón hamburguesa (móvil) */
            body.centrum-public .site-menu-toggle .icon-menu {
                color:#fff;
            }

            /* ---------- MENÚ MÓVIL ---------- */
            body.centrum-public .site-mobile-menu {
                background:var(--ecl-blue-900);
            }
            body.centrum-public .site-mobile-menu .site-mobile-menu-body {
                color:#fff;
            }
            body.centrum-public .site-mobile-menu .site-nav-wrap a {
                color:rgba(255,255,255,.85) !important;
            }
            body.centrum-public .site-mobile-menu .site-nav-wrap a:hover {
                color:var(--ecl-orange-400) !important;
            }
            body.centrum-public .site-mobile-menu .site-mobile-menu-close span {
                color:#fff;
            }

            /* ---------- WHATSAPP FLOTANTE ---------- */
            body.centrum-public a.whatsapp {
                position:fixed;
                right:22px;
                bottom:22px;
                z-index:9998;
                width:58px;
                height:58px;
                border-radius:50%;
                background:#25D366;
                color:#fff !important;
                display:grid;
                place-items:center;
                font-size:1.7rem;
                box-shadow:0 14px 30px -10px rgba(37,211,102,.7);
                animation:eclpulse 2.4s infinite;
                transition:transform .2s ease;
            }
            body.centrum-public a.whatsapp:hover {
                transform:scale(1.08);
            }
            @keyframes eclpulse{
                0%{
                    box-shadow:0 0 0 0 rgba(37,211,102,.55);
                }
                70%{
                    box-shadow:0 0 0 18px rgba(37,211,102,0);
                }
                100%{
                    box-shadow:0 0 0 0 rgba(37,211,102,0);
                }
            }

            /* ---------- MODALES ---------- */
            body.centrum-public .modal-content {
                border:0;
                border-radius:18px;
                overflow:hidden;
                box-shadow:0 40px 80px -30px rgba(6,19,58,.6);
            }
            body.centrum-public .modal-header {
                background:var(--ecl-grad-blue);
                color:#fff;
                border:0;
            }
            body.centrum-public .modal-header .close {
                color:#fff;
                opacity:.9;
                text-shadow:none;
            }
            body.centrum-public .modal-header .modal-title {
                font-weight:800;
            }
            body.centrum-public #confirm-button.btn-success {
                background: #147b57 !important;
                border:0;
            }

            /* ---------- FOOTER ---------- */
            body.centrum-public .site-footer {
                background:var(--ecl-blue-900) !important;
                color:rgba(255,255,255,.72);
                position:relative;
            }
            body.centrum-public .site-footer::before {
                content:"";
                position:absolute;
                top:0;
                left:0;
                right:0;
                height:4px;
                background:var(--ecl-grad-orange);
            }
            body.centrum-public .site-footer img {
                filter:brightness(0) invert(1);
            }
            body.centrum-public .site-footer .footer-heading {
                color:#fff;
                font-weight:800;
                font-size:1.05rem;
                letter-spacing:.5px;
                position:relative;
                display:inline-block;
                padding-bottom:10px;
            }
            body.centrum-public .site-footer .footer-heading::after {
                content:"";
                position:absolute;
                left:0;
                bottom:0;
                width:38px;
                height:3px;
                background:var(--ecl-grad-orange);
                border-radius:3px;
            }
            body.centrum-public .site-footer a {
                color:rgba(255,255,255,.7);
                transition:color .18s ease, padding .18s ease;
            }
            body.centrum-public .site-footer a:hover {
                color:var(--ecl-orange-400);
                text-decoration:none;
                padding-left:4px;
            }
            body.centrum-public .site-footer .list-unstyled li {
                margin-bottom:8px;
            }
            body.centrum-public .site-footer .border-top {
                border-color:rgba(255,255,255,.12) !important;
            }

            /* ---------- FLASH ---------- */
            body.centrum-public #div_flash.alert {
                border-radius:12px;
                font-weight:600;
                box-shadow:0 20px 40px -20px rgba(0,0,0,.5);
                border:0;
            }

            /* CONTENEDOR PRINCIPAL */
            body.centrum-public .ecl-page {
                width: 100%;
                padding: 28px clamp(16px, 4vw, 48px) 60px;
                background: var(--ecl-bg);
            }

            /* CABECERA */
            body.centrum-public .ecl-hero {
                background: var(--ecl-grad-blue);
                border-radius: 22px;
                padding: 38px 40px;
                color: #fff;
                position: relative;
                overflow: hidden;
                box-shadow: 0 28px 60px -32px rgba(6, 19, 58, .6);
                margin-bottom: 24px;
            }

            body.centrum-public .ecl-hero::after {
                content: "";
                position: absolute;
                top: -90px;
                right: -70px;
                width: 320px;
                height: 320px;
                border-radius: 50%;
                background: radial-gradient(
                    circle at 30% 30%,
                    rgba(255, 122, 0, .5),
                    transparent 65%
                    );
            }

            body.centrum-public .ecl-hero .ecl-kick {
                font-size: .76rem;
                font-weight: 800;
                letter-spacing: 2.5px;
                text-transform: uppercase;
                color: var(--ecl-orange-400);
            }

            body.centrum-public .ecl-hero h1 {
                font-size: clamp(1.7rem, 3.5vw, 2.4rem);
                font-weight: 900;
                margin: 6px 0 0;
                letter-spacing: -.02em;
            }

            /* DESCRIPCIÓN DE CABECERA */
            body.centrum-public .ecl-hero-sub {
                margin: 10px 0 0;
                max-width: 620px;
                font-size: .98rem;
                line-height: 1.55;
                color: rgba(255, 255, 255, .82);
                position: relative;
                z-index: 1;
            }

            /* TARJETA / FORMULARIO */
            body.centrum-public .ecl-card {
                background: #fff;
                border: 1px solid var(--ecl-line);
                border-radius: var(--ecl-radius);
                padding: 28px;
                box-shadow: var(--ecl-shadow);
                margin-bottom: 24px;
            }

            /* BOTÓN GENERAL */
            body.centrum-public .ecl-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                border: 0;
                cursor: pointer;
                text-decoration: none;
                font-weight: 700;
                font-size: 15px;
                padding: 12px 28px;
                border-radius: 12px;
                color: #fff;
                transition: transform .18s ease, filter .18s ease;
            }

            body.centrum-public .ecl-btn:hover {
                transform: translateY(-2px);
                filter: brightness(1.06);
                text-decoration: none;
                color: #fff;
            }

            /* BOTÓN AZUL */
            body.centrum-public .ecl-btn--blue {
                background: var(--ecl-grad-blue);
                box-shadow: 0 14px 30px -14px rgba(23, 73, 216, .7);
            }

            /* ETIQUETAS DE FORMULARIO */
            body.centrum-public .ecl-page label,
body.centrum-public .ecl-card label {
                font-weight: 700;
                color: var(--ecl-ink);
            }

            /* CAMPOS DE FORMULARIO */
            body.centrum-public .ecl-page .form-control,
body.centrum-public .ecl-card .form-control {
                border: 1.5px solid #e2e8f0 !important;
                border-radius: 11px !important;
                height: auto !important;
                padding: 10px 13px !important;
                font-size: 14px !important;
                transition: border-color .15s ease, box-shadow .15s ease;
            }

            body.centrum-public .ecl-page .form-control:focus,
body.centrum-public .ecl-card .form-control:focus {
                border-color: var(--ecl-blue-500) !important;
                box-shadow: 0 0 0 4px rgba(23, 73, 216, .12) !important;
            }

/* Identidad exterior aprobada: azul eléctrico y mandarina. */
body.centrum-public {
    --ecl-blue-900: #06133a; --ecl-blue-700: #0b2a6b; --ecl-blue-500: #1749d8;
    --ecl-blue-300: #5b8cff; --ecl-orange-500: #ff7a00; --ecl-orange-400: #ff9d2e;
    --ecl-orange-600: #b34900; --ecl-public-paper: #eef3ff; --ecl-public-soft: #e4ecff;
    --ecl-public-ink: #06133a; --ecl-public-mute: #50617e; --ecl-public-line: #dce4f5;
    --c-blue-900: var(--ecl-blue-900); --c-blue-700: var(--ecl-blue-700);
    --c-blue-500: var(--ecl-blue-500); --c-blue-300: var(--ecl-blue-300);
    --c-orange-500: var(--ecl-orange-500); --c-orange-400: var(--ecl-orange-400);
    --c-orange-600: var(--ecl-orange-600); --c-ink: var(--ecl-public-ink);
    --grad-blue: linear-gradient(135deg,var(--ecl-blue-500),var(--ecl-blue-900));
    --grad-orange: linear-gradient(135deg,var(--ecl-orange-400),var(--ecl-orange-500));
    background: var(--ecl-public-paper); color: var(--ecl-public-ink);
}
body.centrum-public .site-navbar,
body.centrum-public .site-navbar:is(.scrolled,.sleep) {
    position: relative; top: auto; background: var(--ecl-public-paper) !important;
    box-shadow: none; border-bottom: 1px solid var(--ecl-public-line); padding: 15px 20px !important;
}
body.centrum-public .site-navbar > .container { max-width: 1180px !important; }
body.centrum-public .site-navbar .site-logo img { filter: none; width: 148px; height: auto; max-width: 100%; }
body.centrum-public .site-navbar .site-menu > li > a.nav-link { color: var(--ecl-public-ink) !important; font-size: 12px; font-weight: 500; padding: 10px 12px !important; }
body.centrum-public .site-navbar .site-menu > li.active > a.nav-link { color: var(--ecl-orange-600) !important; }
body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton { border-radius: 30px; font-size: 12px; padding: 11px 22px !important; }
body.centrum-public .site-navbar .site-menu > li > a.resaltar_boton[style*="green"] { background: var(--ecl-blue-900) !important; color: #fff !important; }
body.centrum-public .site-navbar .select { background: var(--ecl-paper) !important; color: var(--ecl-public-ink) !important; border-color: var(--ecl-public-line); border-radius: 24px !important; }
body.centrum-public .site-menu-toggle .icon-menu { color: var(--ecl-blue-900); }
body.centrum-public .site-navbar .select .seleccionador { background: var(--ecl-paper); color: var(--ecl-public-ink); border: 1px solid var(--ecl-public-line); border-radius: 12px; }
body.centrum-public .site-navbar .select .seleccionador > div:hover { background: var(--ecl-public-soft); }
body.centrum-public-home .fz { color: var(--ecl-public-ink); overflow-x: clip; }
body.centrum-public-home .fz * { box-sizing: border-box; }
body.centrum-public-home .fz .wrap { max-width: 1180px; padding: 0 30px; margin: 0 auto; }
body.centrum-public-home .fz section { position: relative; scroll-margin-top: 24px; }
body.centrum-public-home .fz-hero { background: var(--ecl-public-paper); }
body.centrum-public-home .fz-hero-grid { display: grid; grid-template-columns: 1.08fr 1fr; align-items: center; gap: 44px; padding: 50px 0 40px; }
body.centrum-public-home .fz-hero h1 { color: var(--ecl-public-ink); font-size: clamp(42px,6vw,76px); line-height: 1.04; font-weight: 500; letter-spacing: -.055em; margin: 0; }
body.centrum-public-home .fz-hero h1 .accent { display: block; color: var(--ecl-orange-600); font-family: Georgia,serif; font-weight: 400; font-style: italic; }
body.centrum-public-home .fz-hero .lead { color: var(--ecl-public-mute); font-size: 15px; line-height: 1.8; max-width: 440px; margin: 22px 0; }
body.centrum-public-home .fz-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 24px; }
body.centrum-public-home .fz-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 20px; border: 1px solid transparent; border-radius: 30px; font-size: 12px; font-weight: 600; line-height: 1.5; text-decoration: none; transition: background .18s; }
body.centrum-public-home .fz-btn--orange { background: var(--ecl-orange-500); color: var(--ecl-blue-900); }
body.centrum-public-home .fz-btn--orange:hover { background: var(--ecl-orange-400); }
body.centrum-public-home .fz-btn--wa, body.centrum-public-home .fz-btn--ghost { background: transparent; color: var(--ecl-public-ink); border-color: var(--ecl-public-line); }
body.centrum-public-home .fz-btn--blue { background: var(--ecl-blue-500); color: #fff; }
body.centrum-public-home .fz-btn:focus-visible,body.centrum-public-home .fz-send:focus-visible,body.centrum-public-home .fz-form-tab:focus-visible { outline: 3px solid var(--ecl-blue-500); outline-offset: 3px; }
body.centrum-public-home .fz-hero-visual { position: relative; padding-bottom: 62px; }
body.centrum-public-home .fz-hero-photo { width: 100%; height: 410px; object-fit: cover; display: block; border-radius: 150px 150px 18px 18px; }
body.centrum-public-home .fz-track { position: relative; margin: -96px 16px 0; background: var(--ecl-public-soft); border: 1px solid var(--ecl-public-line); border-radius: 14px; padding: 17px; box-shadow: 0 8px 24px rgba(6,27,78,.06); }
body.centrum-public-home .fz-track .hd { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12px;  flex-wrap: wrap; }
body.centrum-public-home .fz-track .hd small { font-size: 10px; letter-spacing: 1px; }
body.centrum-public-home .fz-route { display: flex; gap: 12px; align-items: center; margin: 15px 0; }
body.centrum-public-home .fz-route .pt { text-align: center; }
body.centrum-public-home .fz-route .pt b { display: block; font-size: 18px; }
body.centrum-public-home .fz-route .pt span { font-size: 11px; }
body.centrum-public-home .fz-route .line { height: 2px; background: var(--ecl-blue-500); flex: 1; }
body.centrum-public-home .fz-track .bars { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
body.centrum-public-home .fz-track .b { border-top: 1px solid var(--ecl-public-line); padding-top: 10px; text-align: center; }
body.centrum-public-home .fz-track .b b { display: block; color: var(--ecl-orange-600); font-size: 20px; font-weight: 600; }
body.centrum-public-home .fz-track .b span { color: var(--ecl-public-mute); font-size: 11px; }
body.centrum-public-home .fz-marquee { background: var(--ecl-blue-500); color: #fff; padding: 17px 25px; }
body.centrum-public-home .fz-marquee .track { display: flex; flex-wrap: wrap; justify-content: center; gap: 13px 25px; font-size: 10px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; }
body.centrum-public-home .fz-marquee .track > span:nth-child(n+8) { display: none; }
body.centrum-public-home .fz-sec { padding: 50px 0; }
body.centrum-public-home .fz-sec.mist { background: var(--ecl-public-soft); }
body.centrum-public-home .fz-kicker { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 14px; color: var(--ecl-orange-600); }
body.centrum-public-home .fz-h2 { color: inherit; font-size: clamp(27px,3.5vw,36px); line-height: 1.14; font-weight: 500; letter-spacing: -.04em; margin: 0 0 20px; }
body.centrum-public-home .fz-prose { color: var(--ecl-public-mute); font-size: 13px; line-height: 1.85; }
body.centrum-public-home .fz-bento { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 18px; }
body.centrum-public-home .fz-bento .cell { border-radius: 16px; min-width: 0; }
body.centrum-public-home .fz-c-text { grid-column: span 7; padding: 26px; background: transparent; }
body.centrum-public-home .fz-c-photo { grid-column: span 5; overflow: hidden; padding: 0; min-height: 260px; }
body.centrum-public-home .fz-c-photo img { display: block; height: 100%; width: 100%; object-fit: cover; }
body.centrum-public-home .fz-c-blue { grid-column: span 5; background: var(--ecl-blue-500); color: #fff; padding: 24px; }
body.centrum-public-home .fz-c-orange { grid-column: span 7; background: var(--ecl-orange-500); color: var(--ecl-blue-900); padding: 24px; display: flex; align-items: center; gap: 20px; }
body.centrum-public-home .fz-c-blue .big,body.centrum-public-home .fz-c-orange .big { font-size: 34px; font-weight: 500; line-height: 1.1; }
body.centrum-public-home .fz-c-blue p,body.centrum-public-home .fz-c-orange p { font-size: 12px; line-height: 1.6; }
body.centrum-public-home .fz-srv { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
body.centrum-public-home .fz-srv .row { display: flex; flex-direction: column; align-items: flex-start; gap: 17px; padding: 22px 18px; margin: 0; min-width: 0; border-radius: 16px; background: var(--ecl-public-soft); color: var(--ecl-public-ink); text-decoration: none; }
body.centrum-public-home .fz-srv .row:nth-child(2) { background: #ffd3a6; }
body.centrum-public-home .fz-srv .row:nth-child(3) { background: #bad8ff; }
body.centrum-public-home .fz-srv .row:nth-child(4) { background: #ffe39b; }
body.centrum-public-home .fz-srv .row:hover { box-shadow: inset 0 0 0 2px var(--ecl-blue-500); }
body.centrum-public-home .fz-srv .num { font-size: 11px; font-weight: 500; }
body.centrum-public-home .fz-srv .ttl { font-size: 20px; font-weight: 500; line-height: 1.25; letter-spacing: -.025em; }
body.centrum-public-home .fz-srv .ic { margin-top: auto; }
body.centrum-public-home .fz-srv .ic img { width: 27px; height: 27px; object-fit: contain; }
body.centrum-public-home .fz-srv .arrow { color: var(--ecl-blue-900); font-size: 24px; line-height: 1; align-self: flex-end; }
body.centrum-public-home .fz-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
body.centrum-public-home .fz-step { border-top: 1px solid var(--ecl-public-line); padding-top: 18px; }
body.centrum-public-home .fz-step .n { font-family: Georgia,serif; font-style: italic; font-size: 26px; color: var(--ecl-orange-600); margin-bottom: 12px; }
body.centrum-public-home .fz-step h4 { color: var(--ecl-public-ink); font-size: 14px; font-weight: 600; margin: 0 0 9px; }
body.centrum-public-home .fz-step p { color: var(--ecl-public-mute); font-size: 12px; line-height: 1.7; margin: 0; }
body.centrum-public-home .fz-contact { background: var(--ecl-public-paper); color: var(--ecl-public-ink); padding: 50px 30px; }
body.centrum-public-home .fz-contact > .grid { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: 42px; align-items: start; }
body.centrum-public-home .fz-contact .left { padding: 18px 0; min-width: 0; }
body.centrum-public-home .fz-contact .right { background: #ffffff; padding: 25px; border-radius: 16px; min-width: 0; }
body.centrum-public-home .fz-contact .fz-kicker { color: var(--ecl-orange-600) !important; }
body.centrum-public-home .fz-contact .fz-prose { color: var(--ecl-public-mute) !important; }
body.centrum-public-home .fz-info { display: flex; gap: 12px; margin-bottom: 22px; font-size: 12px; line-height: 1.8; }
body.centrum-public-home .fz-info .i { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; border-radius: 10px; background: var(--ecl-public-soft); }
body.centrum-public-home .fz-info b { display: block; font-weight: 600; }
body.centrum-public-home .fz-info a { color: var(--ecl-public-ink); overflow-wrap: anywhere; }
body.centrum-public-home .fz-form-tabs { display: flex; gap: 6px; margin-bottom: 22px; padding: 5px; background: var(--ecl-public-paper); border: 1px solid var(--ecl-public-line); border-radius: 30px; }
body.centrum-public-home .fz-form-tab { flex: 1; border: 0; background: transparent; border-radius: 24px; padding: 10px; color: var(--ecl-public-ink); font-size: 12px; font-weight: 500; }
body.centrum-public-home .fz-form-tab.active { background: var(--ecl-blue-500); color: #fff; }
body.centrum-public-home .fz-form-panel { display: none; }
body.centrum-public-home .fz-form-panel.active { display: block; }
body.centrum-public-home .fz-2col { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
body.centrum-public-home .fz-field { margin-bottom: 14px; min-width: 0; }
body.centrum-public-home .fz-field label { display: block; margin-bottom: 6px; color: var(--ecl-public-ink); font-size: 11px; font-weight: 500; }
body.centrum-public-home .fz-input { width: 100%; min-width: 0; border: 1px solid var(--ecl-public-line); border-radius: 8px; padding: 10px 12px; background: var(--ecl-paper); color: var(--ecl-public-ink); font-size: 14px; line-height: 1.5; }
body.centrum-public-home .fz-input:focus { outline: 2px solid var(--ecl-blue-500); outline-offset: 2px; }
body.centrum-public-home .fz-input::placeholder { color: var(--ecl-public-mute); }
body.centrum-public-home .fz-input option { background: var(--ecl-paper); color: var(--ecl-public-ink); }
body.centrum-public-home .fz-check { display: flex; align-items: flex-start; gap: 9px; margin: 6px 0 18px; font-size: 11px; color: var(--ecl-public-mute); }
body.centrum-public-home .fz-check label { margin: 0; }
body.centrum-public-home .fz-check input { margin-top: 3px; }
body.centrum-public-home .fz-check a { color: var(--ecl-blue-700) !important; }
body.centrum-public-home .fz-send { padding: 12px 22px; border: 0; border-radius: 30px; background: var(--ecl-orange-500); color: var(--ecl-blue-900); font-size: 12px; font-weight: 600; }
body.centrum-public-home .fz-send:disabled { opacity: .6; }
body.centrum-public .site-footer { background: var(--ecl-blue-900) !important; border-top: 0; font-size: 12px; padding: 36px 25px !important; }
body.centrum-public .site-footer::before { display: none; }
body.centrum-public .site-footer .footer-heading { font-size: 13px; margin-bottom: 15px !important; }
body.centrum-public .site-footer .footer-heading::after { display: none; }
body.centrum-public .site-footer p { font-size: 12px; line-height: 1.8; }
body.centrum-public .site-footer .pt-5 { padding-top: 20px !important; }
body.centrum-public .site-footer .mt-5 { margin-top: 0 !important; }
@media (max-width: 900px) {
    body.centrum-public-home .fz-hero-grid { grid-template-columns: 1fr; gap: 30px; padding: 35px 0; }
    body.centrum-public-home .fz-hero-photo { height: 340px; }
    body.centrum-public-home .fz-hero-visual { max-width: 520px; width: 100%; margin: 0 auto; padding-bottom: 10px; }
    body.centrum-public-home .fz-bento .cell { grid-column: span 12 !important; }
    body.centrum-public-home .fz-c-photo { height: 280px; }
    body.centrum-public-home .fz-srv,body.centrum-public-home .fz-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.centrum-public-home .fz-contact > .grid { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 520px) {
    body.centrum-public .site-navbar { padding: 10px 18px !important; }
    body.centrum-public-home .fz .wrap { padding: 0 20px; }
    body.centrum-public-home .fz-sec { padding: 34px 0; }
    body.centrum-public-home .fz-c-text { padding: 0; }
    body.centrum-public-home .fz-c-orange { flex-wrap: wrap; }
    body.centrum-public-home .fz-contact { padding: 34px 20px; }
    body.centrum-public-home .fz-contact .right { padding: 18px; }
    body.centrum-public-home .fz-2col { grid-template-columns: 1fr; gap: 0; }
    body.centrum-public-home .fz-input { font-size: 16px; }
    body.centrum-public-home .fz-srv .ttl { font-size: 17px; }
}

/* Consistencia de presentación: estados, secciones, acciones e importes. */
body.centrum-internal .ecl-cargas-page #myTabs .nav-tabs { gap: 5px; }
body.centrum-internal .ecl-tab-group { flex: 0 0 100%; padding: 8px 4px 3px; font-size: 11px; font-weight: 700; color: var(--ecl-mute); letter-spacing: .04em; }
body.centrum-internal .ecl-tab-group--states { display: none; }
body.centrum-internal .nav-tabs:has(a[onclick*="planning_cargas"]) .ecl-tab-group--states { display: block; }
body.centrum-internal .ecl-tab-group--views { margin-top: 5px; border-top: 1px solid var(--ecl-line); }
body.centrum-internal .ecl-cargas-table:not(#tabla_todas) .ecl-load-state { display: none; }
body.centrum-internal .ecl-number[data-ecl-sign="positive"] { color: #147b57; }
body.centrum-internal .ecl-number[data-ecl-sign="negative"] { color: #b33149; }
body.centrum-internal .ecl-number[data-ecl-sign="zero"] { color: var(--ecl-mute); }
body.centrum-internal .ecl-number { font-variant-numeric: tabular-nums; white-space: nowrap; }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit { color: var(--ecl-mute); }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit:has([data-ecl-sign="positive"]),
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit:has([data-ecl-sign="positive"]) .text-danger { color: #147b57 !important; }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit:has([data-ecl-sign="negative"]),
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit:has([data-ecl-sign="negative"]) .text-danger { color: #b33149 !important; }
body.centrum-internal :is(#contenedor_principal,.modal) .ecl-price-benefit:has([data-ecl-sign="zero"]) .text-danger { color: var(--ecl-mute) !important; }
body.centrum-internal :is(#contenedor_principal,.modal) :is(button,a,input)[data-ecl-purpose="export"] { background: var(--ecl-paper) !important; border-color: var(--ecl-blue-500) !important; color: var(--ecl-blue-500) !important; box-shadow: none !important; }
body.centrum-internal :is(#contenedor_principal,.modal) :is(button,a,input)[data-ecl-purpose="consult"] { background: var(--ecl-blue-500) !important; border-color: var(--ecl-blue-500) !important; color: #fff !important; }
body.centrum-internal .modal :is(label,.ff-step-body label) { font-size: 12px; color: var(--ecl-ink); line-height: 1.4; }
body.centrum-internal .modal :is(.ecl-vehicle-panel .title h3,.ff-step-title,.ecl-form-section-title) { margin: 0; font-size: 13px; font-weight: 700; line-height: 1.4; color: var(--ecl-ink); }

body.centrum-internal .modal .ecl-form-section-title { padding: 9px 0 6px; margin: 8px 0; border-bottom: 1px solid var(--ecl-line); }
body.centrum-internal .modal .ff-step-ic { width: 26px; height: 26px; font-size: 13px; box-shadow: none; }
body.centrum-internal .modal .ecl-vehicle-panel .title { border-bottom: 1px solid var(--ecl-line); padding-bottom: 8px; margin-bottom: 10px; }

/* Datos esenciales completos en las filas de ofertas; el detalle conserva los nodos originales. */
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary > .ecl-md-summary-caption { display: none; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-select .ecl-md-offer-id { font-size: 14px; font-weight: 700; color: var(--ecl-blue-500); margin-bottom: 3px; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-company { display: block; font-weight: 600; color: var(--ecl-ink); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-reference { display: block; margin-top: 4px; font-size: 11px; line-height: 1.4; color: var(--ecl-ink); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-reference > span { color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-price-line { display: flex; justify-content: space-between; align-items: baseline; gap: 7px; margin-bottom: 4px; line-height: 1.4; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-price-line .ecl-md-info-label { font-size: 11px; color: var(--ecl-mute); min-width: 0; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-price-line > strong { flex-shrink: 0; font-size: 12px; font-weight: 600; text-align: right; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-price-line > strong[data-ecl-sign] { white-space: normal; max-width: 60%; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-user-line { margin-bottom: 5px; line-height: 1.35; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-user-line .ecl-md-info-label { display: block; font-size: 11px; color: var(--ecl-mute); }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-user-line > strong { display: block; font-size: 12px; font-weight: 600; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary:has(> .ecl-menu) { text-align: right; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary .ecl-menu { display: inline-block; position: relative; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary .ecl-md-action-button { display: inline-flex !important; align-items: center; justify-content: center; gap: 4px; width: auto !important; min-width: 76px; min-height: 32px; padding: 6px 8px !important; border: 1px solid var(--ecl-blue-500) !important; border-radius: 6px; background: var(--ecl-blue-500) !important; color: #fff !important; box-shadow: none; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-action-label { font-family: inherit; font-size: 11px; font-weight: 600; line-height: 1.3; }
body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-action-button:hover,body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-action-button:focus-visible { background: var(--ecl-blue-900) !important; outline: 2px solid var(--ecl-orange-500); outline-offset: 2px; }
@container (max-width: 980px) {
    body.centrum-internal #contenedor_principal .ecl-md-listhead { display: none; }
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr:has(.ecl-load-identity) { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 16px; padding: 10px 8px; }
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td.ecl-md-column { grid-column: auto !important; grid-row: auto !important; padding: 0 !important; }
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-summary > .ecl-md-summary-caption { display: block; font-size: 11px; font-weight: 600; color: var(--ecl-mute); margin-bottom: 5px; }
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td[data-ecl-md-column=actions] { grid-column: 2 !important; }
}
@container (max-width: 500px) {
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready > tbody > tr > td:is([data-ecl-md-column=price],[data-ecl-md-column=users]) { grid-column: 1 / -1 !important; }
    body.centrum-internal #contenedor_principal .ecl-md-workspace table.ecl-load-table.ecl-cargas-table.ecl-md-ready .ecl-md-user-line { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; }
}

/* Misma identidad en todos los módulos internos y fragmentos de modales. */
body.centrum-internal .ecl-hero :is(h1,h2) { color: #fff !important; }
body.centrum-internal .ecl-hero :is(p,.ecl-hero-sub) { color: #e7edff !important; }
body.centrum-internal .ecl-hero .ecl-kick { color: var(--ecl-orange-500); }
body.centrum-internal .ecl-hero.row { margin-left: 0; margin-right: 0; }
body.centrum-internal .ecl-hero > .text-center.border-primary { text-align: left !important; width: 100%; border: 0 !important; }
body.centrum-internal .ecl-hero h2#titulo { font-size: clamp(1.7rem,3.5vw,2.4rem); font-weight: 900 !important; margin: 6px 0 0 !important; letter-spacing: -.02em; }
body.centrum-internal :is(#contenedor_principal,.modal-body) :is(.ecl-card,.ecl-accounting-card,.ecl-analytics-table-card,.ecl-analytics-filters,.ecl-kpis-filters,.panel.panel-default) { background: var(--ecl-paper); border-color: var(--ecl-line); border-radius: 10px; box-shadow: var(--ecl-shadow); }
body.centrum-internal #contenedor_principal :is(.card-header,.panel-heading) { background: var(--ecl-soft); color: var(--ecl-ink); border-color: var(--ecl-line); }
body.centrum-internal :is(#contenedor_principal,.modal-body) .form-control { background-color: #fff; color: var(--ecl-ink); border-color: var(--ecl-line) !important; }
body.centrum-internal :is(#contenedor_principal,.modal-body) .form-control:focus { border-color: var(--ecl-blue-500) !important; box-shadow: 0 0 0 3px rgba(22,72,232,.12) !important; }
body.centrum-internal :is(#contenedor_principal,.modal-body) .form-control:disabled,
body.centrum-internal :is(#contenedor_principal,.modal-body) .form-control[readonly] { background-color: var(--ecl-soft); color: var(--ecl-mute); }
body.centrum-internal :is(#contenedor_principal,.modal) .nav-tabs .nav-link { color: var(--ecl-mute); border-radius: 6px 6px 0 0; box-shadow: none; }
body.centrum-internal :is(#contenedor_principal,.modal) .nav-tabs .nav-link.active { background: var(--ecl-blue-500) !important; border-color: var(--ecl-blue-500) !important; color: #fff !important; box-shadow: inset 0 -2px 0 var(--ecl-orange-500); }
body.centrum-internal :is(#contenedor_principal,.modal) .nav-tabs .nav-link:hover:not(.active) { background: var(--ecl-soft); color: var(--ecl-blue-500); }
body.centrum-internal :is(#contenedor_principal,.modal) .btn-default { border: 1px solid var(--ecl-blue-500); background: var(--ecl-paper); color: var(--ecl-blue-500); }
body.centrum-internal :is(#contenedor_principal,.modal) :is(.btn-secondary,.ecl-btn--gray,.ecl-btn--grey) { border-color: var(--ecl-line) !important; background: var(--ecl-soft) !important; color: var(--ecl-ink) !important; }
body.centrum-internal .ecl-act--delete { background: #c92f4f; box-shadow: none; }
body.centrum-internal .modal .modal-header .close,
body.centrum-public .modal .modal-header .close { opacity: 1; }
body.centrum-internal .modal .modal-header .close:focus-visible,
body.centrum-public .modal .modal-header .close:focus-visible { outline: 2px solid var(--ecl-orange-500); outline-offset: 2px; }
body.centrum-internal .modal-body :is(.container-modal,.contain) { max-width: 100%; min-width: 0; }
body.centrum-internal .modal-body :is(.ecl-card,.ff-step,.ecl-vehicle-panel,.panel.panel-default) { background: var(--ecl-paper); border-color: var(--ecl-line); box-shadow: none; }
body.centrum-internal .modal-body :is(.title,.ff-step-aside,.panel-heading,.ecl-block-head) { background: transparent; color: var(--ecl-ink); border-color: var(--ecl-line); }
body.centrum-internal .modal-body :is(.title h2,.title h3,.title h4,.title h5,.ff-step-title,.ecl-form-section-title,.ecl-block-head h3) { color: var(--ecl-ink) !important; font-size: 13px !important; font-weight: 600 !important; text-transform: none; letter-spacing: 0; }
body.centrum-internal .modal-body :is(fieldset.fieldset_tender,fieldset.ecl-load-box,.panel.panel-default) { border: 1px solid var(--ecl-line); border-radius: 8px; padding: 12px; margin-bottom: 12px; min-width: 0; }
body.centrum-internal .modal-body fieldset > legend { width: auto; max-width: 100%; font-size: 13px !important; font-weight: 600; color: var(--ecl-ink); padding: 0 6px; margin-bottom: 8px; }
body.centrum-internal .modal-body .panel.panel-default > .panel-body { padding: 0; }
body.centrum-internal .modal-body :is(.label_naranja_general,.label_azul_general) { color: var(--ecl-ink); background: transparent; font-size: 12px; font-weight: 500; margin-bottom: 3px; }
body.centrum-internal .modal-body .group-radio { border: 1px solid var(--ecl-line); border-radius: 6px; padding: 7px 9px; background: var(--ecl-paper); }
body.centrum-internal .modal-body :is(input[type=radio],input[type=checkbox]) { accent-color: var(--ecl-blue-500); }

body.centrum-internal :is(#contenedor_principal,.modal-body) :is(.form-control.is-invalid,.form-control[aria-invalid=true]),
body.centrum-internal :is(#contenedor_principal,.modal-body) .was-validated .form-control:invalid { border-color: #c92f4f !important; }
body.centrum-internal :is(#contenedor_principal,.modal-body) .form-control.is-valid,
body.centrum-internal :is(#contenedor_principal,.modal-body) .was-validated .form-control:valid { border-color: #147b57 !important; }
body.centrum-internal .modal-body fieldset.fieldset_tender > .panel.panel-default { border: 0; border-radius: 0; padding: 0; margin-bottom: 0; box-shadow: none; }

body.centrum-internal :is(#contenedor_principal,.modal-body) table tbody tr:is(.bg-primary,.bg-danger,.bg-success,.bg-dark,.bg-secondary).text-white > td { color: #fff; }
body.centrum-internal #contenedor_principal #tabla-bot tbody tr.bg-secondary { background: var(--ecl-soft) !important; }
body.centrum-internal #contenedor_principal #tabla-bot tbody tr.bg-secondary > td { color: var(--ecl-ink); }

/* Formularios heredados: el contenido respeta el ancho de la modal. */
body.centrum-internal .modal-body .row { margin-left: 0; margin-right: 0; }
body.centrum-internal .modal-body textarea:not(.form-control) { width: 100%; max-width: 100%; min-height: 72px; padding: 5px 9px; font-size: var(--ecl-density-font); line-height: 1.4; border: 1px solid var(--ecl-line); border-radius: 6px; background: #fff; color: var(--ecl-ink); resize: vertical; }
body.centrum-internal .modal-body textarea:not(.form-control):focus { outline: 0; border-color: var(--ecl-blue-500); box-shadow: 0 0 0 3px rgba(22,72,232,.12); }
body.centrum-internal .modal-body .boton_rojo:not([hidden]):not(.hidden):not(.hide):not(.d-none) { display: inline-flex; flex: 0 0 auto; width: auto; max-width: 100%; padding: 0 6px; margin-top: 8px; vertical-align: top; }
body.centrum-internal .modal-body .boton_rojo .btn { width: auto; min-width: 32px; min-height: 32px; background: var(--ecl-blue-500); border-color: var(--ecl-blue-500); color: #fff; }
body.centrum-internal .modal-body .boton_rojo #boton_atras { background: var(--ecl-paper); color: var(--ecl-blue-500); }
body.centrum-internal .modal-body .glyphicon-backward::before { content: '←'; font-family: inherit; font-style: normal; }
body.centrum-internal .modal-body .glyphicon-arrow-up::before { content: '↑'; font-family: inherit; font-style: normal; }

/* Estilos externos centralizados; no incluyen correos ni PDF. */
/* templates/security/login.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-security-login"])) .fz-login {
            background:var(--ecl-blue-900,#06133a);
            position:relative; overflow:hidden;
            padding:140px 0 90px;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login::before {
            content:""; position:absolute; top:-160px; right:-120px;
            width:560px; height:560px; border-radius:50%;
            background:radial-gradient(circle at 30% 30%, rgba(255,122,0,.45), transparent 62%);
            filter:blur(8px); pointer-events:none;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .wrap { max-width:1040px; margin:0 auto; padding:0 22px; position:relative; z-index:2; }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .head { text-align:center; margin-bottom:46px; color:#fff; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .head .kick {
            display:inline-block; font-size:.78rem; font-weight:900; letter-spacing:2.5px;
            text-transform:uppercase; color:var(--ecl-orange-400,#ff9d2e); margin-bottom:10px;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .head h2 { font-size:clamp(1.8rem,4vw,2.6rem); font-weight:900; letter-spacing:-.02em; margin:0; }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:stretch; }
        @media (max-width:820px){ :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .grid { grid-template-columns:1fr; } }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card {
            background:#fff; border-radius:24px; padding:40px;
            box-shadow:0 40px 80px -34px rgba(0,0,0,.6);
            display:flex; flex-direction:column;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent { background:var(--ecl-grad-blue,linear-gradient(135deg,#1749d8,#06133a)); color:#fff; }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card .ic {
            width:56px; height:56px; border-radius:16px; display:grid; place-items:center;
            font-size:1.6rem; margin-bottom:18px;
            background:linear-gradient(135deg, rgba(255,122,0,.15), rgba(226,90,0,.15));
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .ic { background:rgba(255,255,255,.14); }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card h3 { font-size:1.45rem; font-weight:900; margin:0 0 6px; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card .sub { font-size:.95rem; color:#5a647d; margin:0 0 26px; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .sub { color:rgba(255,255,255,.78); }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card .fld { margin-bottom:16px; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card label { display:block; font-size:.82rem; font-weight:700; margin-bottom:6px; color:inherit; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-in {
            width:100%; border:1.5px solid #e2e8f0; border-radius:12px;
            padding:13px 14px; font-size:15px; outline:none; background:#fff; color:#0a1024;
            transition:border-color .18s ease, box-shadow .18s ease;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-in:focus { border-color:var(--ecl-blue-500,#1749d8); box-shadow:0 0 0 4px rgba(23,73,216,.14); }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .fz-in {
            background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); color:#fff;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .fz-in:focus { border-color:var(--ecl-orange-400,#ff9d2e); box-shadow:0 0 0 4px rgba(255,122,0,.2); }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .fz-in::placeholder { color:rgba(255,255,255,.5); }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-cta {
            border:0; cursor:pointer; width:100%;
            padding:14px; border-radius:12px; font-weight:800; font-size:15px; color:#fff;
            transition:transform .18s ease, filter .18s ease; margin-top:6px;
        }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-cta:hover { transform:translateY(-2px); }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-cta--blue { background:var(--ecl-grad-blue,linear-gradient(135deg,#1749d8,#06133a)); }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-cta--orange { background:var(--ecl-grad-orange,linear-gradient(135deg,#ff9d2e,#e25a00)); }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .forgot { display:block; text-align:right; margin-top:14px; font-size:.88rem; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .forgot a { color:var(--ecl-blue-500,#1749d8); text-decoration:underline; }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-login .alert { border-radius:12px; border:0; font-weight:600; }

        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .spacer { flex:1; }
        :where(html:has(template[data-centrum-style="public-security-login"])) .fz-card.accent .note { font-size:.82rem; color:rgba(255,255,255,.6); margin-top:22px; }

/* templates/ve/aviso-legal.html.twig, templates/ve/politicas-privacidad-app.html.twig — estilos conservados y delimitados por vista. */
/* ===== HERO (mismo lenguaje que .fz-login) ===== */
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover > .container > .row {
            min-height:380px !important;
            height:auto !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover {
       position:relative; overflow:hidden;
       background:var(--ecl-blue-900,#06133a) !important;
       background-image:none !important;
       padding:140px 22px 160px;
   }

   /* Degradado de fondo (antes era el tinte sobre la foto) */
   :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover.overlay::before {
       content:""; position:absolute; inset:0;
       background:linear-gradient(135deg, #06133a 0%, #0c1f5c 55%, #1749d8 100%) !important;
       opacity:1 !important; z-index:1;
   }
        /* Círculo naranja */
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover::after {
            content:""; position:absolute; top:-160px; right:-120px;
            width:560px; height:560px; border-radius:50%;
            background:radial-gradient(circle at 30% 30%, rgba(255,122,0,.45), transparent 62%);
            filter:blur(8px); pointer-events:none; z-index:1;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home > .container { position:relative; z-index:2; }

        /* Kicker + título (igual que .head) */
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home .col-md-11::before {
            content:"Centrum Trans";
            display:inline-block; font-size:.78rem; font-weight:900; letter-spacing:2.5px;
            text-transform:uppercase; color:var(--ecl-orange-400,#ff9d2e); margin-bottom:10px;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home h1 {
            font-size:clamp(1.8rem,4vw,2.6rem) !important;
            font-weight:900 !important; letter-spacing:-.02em;
            text-transform:none !important; margin:0;
        }

        /* ===== CONTENIDO: tarjeta que monta sobre el hero ===== */
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos.site-section {
            background:#f4f7fd;
            padding:0 22px 90px;
            position:relative; z-index:3;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos > .container {
            max-width:1040px;
            margin-top:-90px;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .row.mb-5 { margin-bottom:0 !important; }

        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 {
            background:#fff; border-radius:24px; padding:48px 52px;
            box-shadow:0 40px 80px -34px rgba(6,19,58,.35);
            border-top:4px solid var(--ecl-orange-500,#ff7a00);
        }

        /* Tipografía del texto legal (viene con |raw, así que cubro también etiquetas internas) */
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 p {
            font-size:15.5px; line-height:1.8; color:#3a4560;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h1,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h2,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h3,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h4 {
            color:var(--ecl-blue-900,#06133a); font-weight:900;
            letter-spacing:-.01em; margin:32px 0 12px;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h2 { font-size:1.5rem; }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h3 { font-size:1.25rem; }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 h4 { font-size:1.05rem; }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 > :first-child { margin-top:0; }

        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 strong,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 b { color:var(--ecl-blue-900,#06133a); font-weight:700; }

        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 a {
            color:var(--ecl-blue-500,#1749d8); text-decoration:underline;
            text-underline-offset:3px; word-break:break-word;
        }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 a:hover { color:var(--ecl-orange-600,#e25a00); }

        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 ul,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 ol { padding-left:1.3rem; margin:0 0 18px; }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 li { margin-bottom:6px; }
        :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 li::marker { color:var(--ecl-orange-500,#ff7a00); }

        @media (max-width:768px){
            :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-home.site-blocks-cover { padding:110px 16px 130px; }
            :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 { padding:30px 22px; border-radius:18px; }
            :where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12,
:where(html:has(template[data-centrum-style="public-ve-aviso-legal"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad-app"])) #section-quienes-somos .col-md-12 p { text-align:left !important; }
        }

/* templates/ve/captacionLead.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-captacionLead"])) .btn-light {
        background-color: white;
    }

/* templates/ve/condiciones-subcontratacion.html.twig, templates/ve/politicas-cookies.html.twig, templates/ve/politicas-privacidad.html.twig, templates/ve/privacy-policy-gdpr.html.twig — estilos conservados y delimitados por vista. */
/* ===== HERO (mismo lenguaje que .fz-login) ===== */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover > .container > .row {
            min-height:380px !important;
            height:auto !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover {
            position:relative; overflow:hidden;
            background:var(--ecl-blue-900,#06133a) !important;
            padding:140px 22px 160px;
        }
        /* Degradado de fondo */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover.overlay::before {
            content:""; position:absolute; inset:0;
            background:linear-gradient(135deg, #06133a 0%, #0c1f5c 55%, #1749d8 100%) !important;
            opacity:1 !important; z-index:1;
        }
        /* Círculo naranja */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover::after {
            content:""; position:absolute; top:-160px; right:-120px;
            width:560px; height:560px; border-radius:50%;
            background:radial-gradient(circle at 30% 30%, rgba(255,122,0,.45), transparent 62%);
            filter:blur(8px); pointer-events:none; z-index:1;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home > .container { position:relative; z-index:2; }

        /* Kicker + título (igual que .head) */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home .col-md-11::before {
            content:"Centrum Trans";
            display:inline-block; font-size:.78rem; font-weight:900; letter-spacing:2.5px;
            text-transform:uppercase; color:var(--ecl-orange-400,#ff9d2e); margin-bottom:10px;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home h1 {
            font-size:clamp(1.8rem,4vw,2.6rem) !important;
            font-weight:900 !important; letter-spacing:-.02em;
            text-transform:none !important; margin:0;
        }

        /* ===== CONTENIDO: tarjeta que monta sobre el hero ===== */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos.site-section {
            background:#f4f7fd;
            padding:0 22px 90px;
            position:relative; z-index:3;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos > .container {
            max-width:1040px;
            margin-top:-90px;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .row.mb-5 { margin-bottom:0 !important; }

        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 {
            background:#fff; border-radius:24px; padding:48px 52px;
            box-shadow:0 40px 80px -34px rgba(6,19,58,.35);
            border-top:4px solid var(--ecl-orange-500,#ff7a00);
        }

        /* Tipografía del texto legal (viene con |raw) */
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 p {
            font-size:15.5px; line-height:1.8; color:#3a4560;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h1,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h2,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h3,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h4 {
            color:var(--ecl-blue-900,#06133a); font-weight:900;
            letter-spacing:-.01em; margin:32px 0 12px;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h2 { font-size:1.5rem; }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h3 { font-size:1.25rem; }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 h4 { font-size:1.05rem; }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 > :first-child { margin-top:0; }

        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 strong,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 b { color:var(--ecl-blue-900,#06133a); font-weight:700; }

        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 a {
            color:var(--ecl-blue-500,#1749d8); text-decoration:underline;
            text-underline-offset:3px; word-break:break-word;
        }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 a:hover { color:var(--ecl-orange-600,#e25a00); }

        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 ul,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 ol { padding-left:1.3rem; margin:0 0 18px; }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 li { margin-bottom:6px; }
        :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 li::marker { color:var(--ecl-orange-500,#ff7a00); }

        @media (max-width:768px){
            :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-home.site-blocks-cover { padding:110px 16px 130px; }
            :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 { padding:30px 22px; border-radius:18px; }
            :where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12,
:where(html:has(template[data-centrum-style="public-ve-condiciones-subcontratacion"]),html:has(template[data-centrum-style="public-ve-politicas-cookies"]),html:has(template[data-centrum-style="public-ve-politicas-privacidad"]),html:has(template[data-centrum-style="public-ve-privacy-policy-gdpr"])) #section-quienes-somos .col-md-12 p { text-align:left !important; }
        }

/* templates/ve/contactarAgenteVenta.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-page,
:where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-page * {
            box-sizing: border-box;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-page {
            width: 100%;
            min-height: 100vh;
            padding: 110px 24px 40px;
            background: #f5f7fb;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-section {
            width: 100%;
            max-width: 1150px;
            margin: 0 auto;
            overflow: hidden;
            background: #fff;
            border-radius: 6px;
            box-shadow: 0 2px 12px rgba(6, 19, 58, 0.08);
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 16px 20px;
            background: #06133a;
            color: #fff;
            border-bottom: 3px solid #ff7a00;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-title {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
            margin: 0;
            color: #fff;
            font-size: 16px;
            font-weight: 700;
            line-height: 1.4;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-id {
            font-size: 12px;
            font-weight: 500;
            opacity: 0.85;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-form {
            padding: 24px;
            background: #fff;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-message {
            margin-top: 24px;
            padding: 20px;
            background: #f8faff;
            border: 1px solid #e5eaf3;
            border-radius: 5px;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-label {
            display: block;
            margin-bottom: 10px;
            color: #06133a;
            font-size: 13px;
            font-weight: 600;
            text-align: left;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-textarea {
            display: block;
            width: 100%;
            min-height: 130px;
            padding: 12px;
            border: 1px solid #dce3ee;
            border-radius: 4px;
            background: #fff;
            color: #253047;
            font-size: 13px;
            line-height: 1.6;
            resize: vertical;
            transition: border-color 0.2s, box-shadow 0.2s;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-textarea:focus {
            outline: none;
            border-color: #1749d8;
            box-shadow: 0 0 0 3px rgba(23, 73, 216, 0.1);
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-actions {
            display: flex;
            justify-content: center;
            padding-top: 24px;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-submit {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 180px;
            min-height: 42px;
            padding: 10px 24px;
            border: 1px solid #1749d8;
            border-radius: 4px;
            background: #1749d8;
            color: #fff;
            font-size: 13px;
            font-weight: 600;
            cursor: pointer;
            transition: background-color 0.2s;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-submit:hover {
            background: #1039b0;
            border-color: #1039b0;
            color: #fff;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-submit:focus {
            outline: 2px solid #ff7a00;
            outline-offset: 2px;
        }

        :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-submit:disabled {
            opacity: 0.65;
            cursor: not-allowed;
        }

        /* Tablet */
        @media (max-width: 1024px) {
            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-page {
                padding: 100px 16px 30px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-form {
                padding: 18px;
            }
        }

        /* Móvil */
        @media (max-width: 767.98px) {
            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-page {
                padding: 85px 8px 20px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-header {
                padding: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-title {
                font-size: 13px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-id {
                font-size: 11px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-form {
                padding: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-message {
                margin-top: 16px;
                padding: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-textarea {
                min-height: 120px;
                font-size: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-actions {
                padding-top: 18px;
            }

            :where(html:has(template[data-centrum-style="public-ve-contactarAgenteVenta"])) .ecl-contact-submit {
                width: 100%;
            }
        }

/* templates/ve/detalleTrayectoExt.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-page,
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-page * {
            box-sizing: border-box;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-page {
            width: 100%;
            padding: 110px 24px 32px;
            background: #f5f7fb;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-section {
            display: flex;
            flex-direction: column;
            width: 100%;
            min-width: 0;
            overflow: hidden;
            background: white;
            border-radius: 6px;
            box-shadow: 0 2px 12px rgba(6, 19, 58, 0.08);
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-header {
            flex: 0 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 12px;
            padding: 14px 18px;
            background: #06133a;
            color: white;
            border-bottom: 3px solid #ff7a00;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-title {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
            margin: 0;
            font-size: 15px;
            font-weight: 700;
            color: white;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-id {
            font-size: 12px;
            font-weight: 500;
            opacity: 0.85;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-container {
            display: grid;
            grid-template-columns:
                minmax(0, 3fr)
                minmax(280px, 1fr);
            width: 100%;
            height: 650px;
            min-width: 0;
            min-height: 0;
            gap: 12px;
            padding: 12px;
            overflow: hidden;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) #map-detalle-trayecto {
            width: 100%;
            height: 100%;
            min-width: 0;
            min-height: 0;
            overflow: hidden;
            border-radius: 4px;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar {
            width: 100%;
            height: 100%;
            min-width: 0;
            min-height: 0;
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            border-radius: 4px;
            background: #fff;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar::-webkit-scrollbar {
            width: 4px;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar::-webkit-scrollbar-track {
            background: #f1f1f1;
            border-radius: 2px;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar::-webkit-scrollbar-thumb {
            background: #1749d8;
            border-radius: 2px;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar table,
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-directions {
            width: 100% !important;
            max-width: 100% !important;
            font-size: 11px !important;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar img {
            max-width: 100%;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-listheader,
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-summary {
            color: #06133a !important;
            font-weight: 600 !important;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-listsel,
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-listsel b {
            font-weight: 600 !important;
            background-color: #e3f2fd !important;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-directions tbody tr:nth-child(even) {
            background-color: #f9f9f9;
        }

        :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-directions tbody tr:nth-child(odd) {
            background-color: white;
        }

        /* Tablet */
        @media (max-width: 1024px) {
            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-page {
                padding: 100px 12px 20px;
            }

            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-container {
                grid-template-columns:
                    minmax(0, 2fr)
                    minmax(240px, 1fr);
                gap: 8px;
                padding: 8px;
            }
        }

        /* Móvil vertical */
        @media (max-width: 767.98px) {
            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-page {
                padding: 85px 6px 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-header {
                padding: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-title {
                font-size: 13px;
                flex-wrap: wrap;
            }

            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-container {
                grid-template-columns: minmax(0, 1fr);
                grid-template-rows:
                    minmax(220px, 60%)
                    minmax(150px, 40%);
                height: calc(100dvh - 170px);
                min-height: 420px;
                gap: 6px;
                padding: 6px;
            }

            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar table,
:where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-sidebar .adp-directions {
                font-size: 10px !important;
            }
        }

        /* Móvil horizontal */
        @media (max-height: 550px) and (orientation: landscape) {
            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-container {
                grid-template-columns:
                    minmax(0, 1.7fr)
                    minmax(210px, 1fr);
                grid-template-rows: minmax(0, 1fr);
                height: 350px;
            }
        }

        /* Móviles estrechos */
        @media (max-width: 380px) and (orientation: portrait) {
            :where(html:has(template[data-centrum-style="public-ve-detalleTrayectoExt"])) .ecl-route-container {
                grid-template-rows:
                    minmax(200px, 55%)
                    minmax(140px, 45%);
            }
        }

/* templates/ve/estadoCargaFacturaCliente.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) body {
            background-color: #f8f9fa;
        }
        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .header {
            background-color: #e9ecef;
            padding: 10px;
            border-radius: 5px;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .map-container {
            width: 100%;
            height: 300px;
            background-size: cover;
            border-radius: 5px;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .status-bar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
            gap: 5px;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .status-bar .step {
            flex-grow: 1;
            text-align: center;
            padding: 2px;
            color: white;
            position: relative;
            clip-path: polygon(0% 0%, 95% 0%, 100% 50%, 95% 100%, 0% 100%, 5% 50%);
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .status-bar .step:last-child {
            margin-right: 0;
            clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 100% 100%, 0% 100%, 5% 50%);
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .card-header-1 {
            margin: 16px;
            font-weight: 700;
        }


        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .documentos-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 1.5rem;
            padding: 10px;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .documento-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .documento-fecha {
            margin-bottom: 8px;
            font-size: 0.9rem;
            color: #555;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .documento-title {
            margin-top: 8px;
            font-weight: 600;
            font-size: 0.95rem;
            color: #333;
        }

        /* Sobrescribe el color de text-muted a rojo de Bootstrap */
        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .text-muted {
            color: #dc3545 !important;
        }

        /* Estilos para Signature Pad */
        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .signature-pad-container {
            border: 1px solid #ced4da;
            border-radius: .25rem;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .signature-pad-container canvas {
            width: 100%;
            height: 120px;
            touch-action: none;
        }

        :where(html:has(template[data-centrum-style="public-ve-estadoCargaFacturaCliente"])) .modal {
            z-index: 2000 !important;
        }

/* templates/ve/landingMarruecos.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) body {
                --bg: #eef3ff;
                --bg-2: #ffffff;
                --surface: rgba(255,255,255,0.72);
                --surface-solid: #ffffff;
                --primary: #06133a;
                --primary-2: #1749d8;
                --accent: #ff7a00;
                --accent-2: #ff9d2e;
                --soft-blue: #dce7ff;
                --text: #06133a;
                --muted: #34507c;
                --line: rgba(7, 26, 75, 0.08);
                --shadow-xl: 0 30px 80px rgba(8, 22, 61, 0.12);
                --shadow-lg: 0 18px 40px rgba(8, 22, 61, 0.08);
                --radius-xl: 18px;
                --radius-lg: 14px;
                --radius-md: 10px;
                --max: 1180px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) body {
                margin: 0;
                font-family: Arial, Helvetica, sans-serif;
                color: var(--text);
                background:
                    radial-gradient(circle at 0% 0%, rgba(72,160,255,0.16), transparent 26%),
                    radial-gradient(circle at 100% 10%, rgba(7,26,75,0.08), transparent 28%),
                    linear-gradient(180deg, #eef3ff 0%, var(--bg) 100%);
                overflow-x: hidden;
            }



            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) img,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) video,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) iframe {
                max-width: 100%;
            }


            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) * {
                box-sizing: border-box;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) img {
                max-width: 100%;
                height: auto;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) {
                scroll-behavior: smooth;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .grecaptcha-badge {
                visibility: hidden !important;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .whatsapp {
                position: fixed;
                right: 20px;
                bottom: 20px;
                width: 60px;
                height: 60px;
                border-radius: 50%;
                background: #25D366;
                display: flex;
                align-items: center;
                justify-content: center;
                z-index: 99999;
                box-shadow: 0 8px 20px rgba(0,0,0,0.2);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .whatsapp-icon {
                font-size: 32px;
                color: white;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field.full-width {
                grid-column: 1 / -1;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .radio-group {
                display: flex;
                align-items: center;
                gap: 18px;
                flex-wrap: wrap;
                margin-top: 4px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .radio-group label {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                margin: 0;
                font-size: 15px;
                font-weight: 600;
                color: #081a4b;
                white-space: nowrap;
                cursor: pointer;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .radio-group input[type="radio"] {
                margin: 0;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) a {
                text-decoration: none;
                color: inherit;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .page {
                width: 100%;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .topbar {
                width: min(var(--max), calc(100% - 40px));
                margin: 0 auto;
                padding: 18px 0 10px;
                color: #70819a;
                font-size: 12px;
                line-height: 1.5;
                letter-spacing: 1.3px;
                text-transform: uppercase;
            }


            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .shell {
                width: 100%;
                margin: 0;
                border-radius: 0;
                overflow: hidden;
                box-shadow: none;
                border: none;
                background: linear-gradient(180deg, rgba(255,255,255,0.72) 0%, rgba(248,251,255,0.92) 100%);
                backdrop-filter: blur(18px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .stripe {
                display: grid;
                grid-template-columns: 24% 28% 24% 24%;
                height: 6px;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .stripe div:nth-child(1) {
                background:#081a4b;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .stripe div:nth-child(2) {
                background:#1749d8;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .stripe div:nth-child(3) {
                background:#5eb2ff;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .stripe div:nth-child(4) {
                background:#dceeff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero {
                position: relative;
                background:
                    radial-gradient(circle at 85% 18%, rgba(72,160,255,0.28), transparent 18%),
                    radial-gradient(circle at 15% 90%, rgba(126,192,255,0.12), transparent 22%),
                    linear-gradient(135deg, #06133a 0%, #0a2367 52%, #081d55 100%);
                color: #fff;
                overflow: hidden;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero::before,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero::after {
                content: "";
                position: absolute;
                border-radius: 50%;
                pointer-events: none;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero::before {
                width: 520px;
                height: 520px;
                right: -200px;
                top: -120px;
                background: radial-gradient(circle, rgba(72,160,255,0.18), rgba(72,160,255,0));
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero::after {
                width: 340px;
                height: 340px;
                left: -120px;
                bottom: -120px;
                background: radial-gradient(circle, rgba(255,255,255,0.08), rgba(255,255,255,0));
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-inner {
                width: 100%;
                max-width: 1320px;
                margin: 0 auto;
                padding: 34px 40px 54px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .nav {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 20px;
                margin-bottom: 34px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .brand {
                display: flex;
                align-items: center;
                gap: 14px;
                font-size: 21px;
                font-weight: 700;
                letter-spacing: -0.4px;
            }


            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .nav-links {
                display: flex;
                align-items: center;
                gap: 22px;
                color: rgba(255,255,255,0.84);
                font-size: 14px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .nav-links a:hover {
                color: #fff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 28px;
                align-items: center;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .eyebrow {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                padding: 11px 16px;
                border-radius: 999px;
                background: rgba(255,255,255,0.08);
                border: 1px solid rgba(255,255,255,0.14);
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: #dbe8ff;
                backdrop-filter: blur(10px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .eyebrow i {
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: var(--accent);
                box-shadow: 0 0 0 6px rgba(72,160,255,0.14);
                display: inline-block;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) h1 {
                margin: 24px 0 18px;
                font-size: clamp(56px, 8vw, 94px);
                line-height: 0.92;
                letter-spacing: -3px;
                color: #fff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-subtitle {
                margin: 0;
                max-width: 820px;
                font-size: clamp(24px, 2.4vw, 32px);
                line-height: 1.22;
                font-weight: 700;
                color: var(--accent-2);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-copy {
                margin: 20px 0 0;
                max-width: 840px;
                font-size: 18px;
                line-height: 1.95;
                color: #dce6fb;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-copy strong {
                color: #fff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .metrics {
                display: grid;
                grid-template-columns: repeat(3, minmax(0,1fr));
                gap: 16px;
                margin: 30px 0 34px;
                max-width: 920px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .metric {
                padding: 20px 18px;
                border-radius: 20px;
                background: rgba(255,255,255,0.06);
                border: 1px solid rgba(255,255,255,0.1);
                backdrop-filter: blur(10px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .metric strong {
                display: block;
                margin-bottom: 6px;
                font-size: 18px;
                color: #fff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .metric span {
                display: block;
                font-size: 15px;
                line-height: 1.7;
                color: #deebff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-actions {
                display: flex;
                flex-wrap: wrap;
                gap: 14px;
                align-items: center;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-height: 58px;
                padding: 0 28px;
                border-radius: 18px;
                font-size: 16px;
                font-weight: 700;
                transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn:hover {
                transform: translateY(-2px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn-primary {
                background: linear-gradient(180deg, #67b7ff 0%, #ff7a00 100%);
                color: #061946;
                box-shadow: 0 16px 32px rgba(72,160,255,0.22);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn-secondary {
                color: #fff;
                border: 1px solid rgba(255,255,255,0.16);
                background: rgba(255,255,255,0.04);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-side {
                display: grid;
                gap: 18px;
                align-content: start;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .glass-card,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .solid-card {
                border-radius: 30px;
                padding: 28px;
                box-shadow: 0 24px 50px rgba(4, 12, 38, 0.16);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .glass-card {
                background: rgba(255,255,255,0.96);
                color: var(--text);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .solid-card {
                background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.06) 100%);
                border: 1px solid rgba(255,255,255,0.12);
                color: #fff;
                backdrop-filter: blur(12px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .card-label {
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: #6f7f96;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .glass-card .big-route {
                margin-top: 14px;
                font-size: clamp(34px, 4vw, 48px);
                line-height: 0.95;
                letter-spacing: -1.8px;
                color: var(--primary);
                font-weight: 800;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .glass-card .copy {
                margin-top: 14px;
                font-size: 15px;
                line-height: 1.8;
                color: var(--muted);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .detail-grid {
                display: grid;
                gap: 18px;
                margin-top: 24px;
                padding-top: 22px;
                border-top: 1px solid var(--line);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .detail h3 {
                margin: 0 0 6px;
                font-size: 13px;
                color: #72819a;
                font-weight: 400;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .detail p {
                margin: 0;
                font-size: 18px;
                line-height: 1.5;
                color: #111;
                font-weight: 700;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .solid-card h3 {
                margin: 0;
                font-size: 22px;
                line-height: 1.2;
                letter-spacing: -0.6px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .solid-card p {
                margin: 12px 0 0;
                font-size: 15px;
                line-height: 1.8;
                color: #dce7ff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .mini-points {
                display: grid;
                gap: 10px;
                margin-top: 20px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .mini-point {
                padding: 14px 16px;
                border-radius: 16px;
                background: rgba(255,255,255,0.06);
                border: 1px solid rgba(255,255,255,0.08);
                font-size: 14px;
                line-height: 1.6;
                color: #eff5ff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section {
                width: 100%;
                max-width: 1320px;
                margin: 0 auto;
                padding: 84px 40px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .head {
                max-width: 980px;
                margin-bottom: 36px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .kicker {
                margin: 0 0 10px;
                font-size: 12px;
                color: #2563eb;
                font-weight: 700;
                letter-spacing: 1px;
                text-transform: uppercase;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .head h2 {
                margin: 0;
                font-size: clamp(38px, 4.2vw, 58px);
                line-height: 1.03;
                letter-spacing: -2px;
                color: var(--primary);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .head p {
                margin: 18px 0 0;
                font-size: 18px;
                line-height: 1.92;
                color: var(--muted);
                max-width: 980px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .services {
                display: grid;
                grid-template-columns: repeat(3, minmax(0,1fr));
                gap: 20px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service {
                position: relative;
                padding: 32px 28px;
                border-radius: 28px;
                background: linear-gradient(180deg, #ffffff 0%, #edf5ff 100%);
                border: 1px solid rgba(72,160,255,0.14);
                box-shadow: var(--shadow-lg);
                overflow: hidden;
                transition: transform .18s ease, box-shadow .18s ease;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service:hover {
                transform: translateY(-5px);
                box-shadow: 0 24px 44px rgba(8, 22, 61, 0.10);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service::after {
                content: "";
                position: absolute;
                right: -30px;
                top: -40px;
                width: 120px;
                height: 120px;
                border-radius: 50%;
                background: radial-gradient(circle, rgba(72,160,255,0.12), rgba(72,160,255,0));
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service-number {
                font-size: 12px;
                font-weight: 700;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: #2563eb;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service h3 {
                margin: 14px 0 12px;
                font-size: 30px;
                line-height: 1.06;
                letter-spacing: -0.8px;
                color: var(--primary);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service p {
                margin: 0 0 18px;
                font-size: 16px;
                line-height: 1.9;
                color: #506279;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service ul {
                margin: 0;
                padding-left: 18px;
                font-size: 15px;
                line-height: 1.85;
                color: #41536a;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .story {
                width: 100%;
                max-width: 1320px;
                margin: 0 auto;
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr);
                gap: 24px;
                padding: 0 40px 24px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel {
                border-radius: 30px;
                padding: 36px 32px;
                background: #fff;
                border: 1px solid rgba(7,26,75,0.06);
                box-shadow: var(--shadow-lg);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark {
                background: linear-gradient(135deg, #091f5b 0%, #12338d 100%);
                color: #fff;
                position: relative;
                overflow: hidden;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark::after {
                content: "";
                position: absolute;
                inset: auto -50px -70px auto;
                width: 240px;
                height: 240px;
                border-radius: 50%;
                background: radial-gradient(circle, rgba(72,160,255,0.24), rgba(72,160,255,0));
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel h3 {
                margin: 0;
                font-size: 36px;
                line-height: 1.06;
                letter-spacing: -1px;
                color: var(--primary);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel p {
                margin: 16px 0 0;
                font-size: 17px;
                line-height: 1.9;
                color: var(--muted);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark h3,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark p,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark .kicker,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark .feature-list,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark .feature-list strong {
                position: relative;
                z-index: 1;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark h3 {
                color: #fff;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark p {
                color: #d9e6ff;
            }
            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel-dark .kicker {
                color: #97c7ff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .feature-list {
                display: grid;
                gap: 14px;
                margin-top: 26px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .feature-row {
                padding: 16px 18px;
                border-radius: 18px;
                background: rgba(255,255,255,0.05);
                border: 1px solid rgba(255,255,255,0.08);
                color: #eef5ff;
                font-size: 15px;
                line-height: 1.7;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .feature-row strong {
                display: block;
                margin-bottom: 4px;
                color: #fff;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .checks {
                display: grid;
                grid-template-columns: repeat(2, minmax(0,1fr));
                gap: 14px;
                margin-top: 28px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .check {
                padding: 18px;
                border-radius: 18px;
                background: linear-gradient(180deg, #ffffff 0%, #f2f7ff 100%);
                border: 1px solid rgba(7,26,75,0.06);
                font-size: 15px;
                line-height: 1.75;
                color: #415167;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .check strong {
                display: block;
                margin-bottom: 4px;
                color: var(--primary);
                font-size: 15px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-wrap {
                width: 100%;
                max-width: 1320px;
                margin: 0 auto;
                padding: 44px 40px 90px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta {
                position: relative;
                overflow: hidden;
                border-radius: 34px;
                padding: 42px 38px;
                background:
                    radial-gradient(circle at 85% 10%, rgba(255,255,255,0.20), transparent 18%),
                    linear-gradient(135deg, #59abff 0%, #3d94f7 55%, #1f70ea 100%);
                color: #081a4b;
                box-shadow: var(--shadow-xl);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta::after {
                content: "";
                position: absolute;
                right: -100px;
                bottom: -110px;
                width: 280px;
                height: 280px;
                border-radius: 50%;
                background: radial-gradient(circle, rgba(255,255,255,0.18), rgba(255,255,255,0));
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-grid {
                position: relative;
                z-index: 1;
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(320px, 0.75fr);
                gap: 24px;
                align-items: center;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta h2 {
                margin: 0;
                font-size: clamp(38px, 4vw, 60px);
                line-height: 1.02;
                letter-spacing: -2px;
                color: #081a4b;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta p {
                margin: 16px 0 0;
                max-width: 860px;
                font-size: 18px;
                line-height: 1.88;
                color: #16376e;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box {
                padding: 26px;
                border-radius: 26px;
                background: rgba(255,255,255,0.24);
                border: 1px solid rgba(255,255,255,0.32);
                backdrop-filter: blur(12px);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box h3 {
                margin: 0 0 14px;
                font-size: 20px;
                color: #081a4b;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box .item {
                padding: 14px 0;
                border-bottom: 1px solid rgba(8,26,75,0.08);
                font-size: 15px;
                line-height: 1.7;
                color: #1a3b73;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box .item:last-child {
                border-bottom: 0;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box strong {
                display: block;
                color: #081a4b;
                margin-bottom: 2px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-actions {
                margin-top: 24px;
                display: flex;
                flex-wrap: wrap;
                gap: 12px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn-dark {
                background: #081a4b;
                color: #fff;
                box-shadow: 0 16px 32px rgba(8,26,75,0.18);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .btn-light {
                background: rgba(255,255,255,0.24);
                border: 1px solid rgba(255,255,255,0.32);
                color: #081a4b;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .footer {
                width: min(var(--max), calc(100% - 40px));
                margin: 0 auto 26px;
                padding: 0 0 4px;
                text-align: center;
                font-size: 13px;
                line-height: 1.9;
                color: #6e7d96;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .footer a {
                color: #49617f;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-form {
                display: grid;
                gap: 14px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-row {
                display: grid;
                grid-template-columns: repeat(2, minmax(0,1fr));
                gap: 14px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field {
                display: grid;
                gap: 8px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field > label,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-check label {
                font-size: 14px;
                font-weight: 700;
                color: #081a4b;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field input,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field select,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field textarea {
                width: 100%;
                border: 1px solid rgba(8,26,75,0.10);
                background: rgba(255,255,255,0.92);
                border-radius: 14px;
                padding: 14px 16px;
                font-size: 15px;
                color: #06133a;
                outline: none;
                font-family: inherit;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field textarea {
                min-height: 140px;
                resize: vertical;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field input:focus,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field select:focus,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-field textarea:focus {
                border-color: #ff7a00;
                box-shadow: 0 0 0 3px rgba(72,160,255,0.12);
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-check {
                display: flex;
                align-items: flex-start;
                gap: 10px;
                font-size: 14px;
                line-height: 1.6;
                color: #16376e;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-check input {
                margin-top: 4px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-check a {
                text-decoration: underline;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-submit {
                margin-top: 4px;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-submit .btn {
                border: 0;
                cursor: pointer;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .lang-switcher select {
                border: 1px solid rgba(255,255,255,0.18);
                color: #06133a;
                background: #fff;
                border-radius: 12px;
                padding: 10px 12px;
                font-size: 13px;
                font-weight: 700;
                outline: none;
                cursor: pointer;
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .lang-switcher select option {
                color: #06133a;
                background: #fff;
            }

            @media (max-width: 1100px) {
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-grid {
                    grid-template-columns: 1fr;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-side {
                    max-width: 100%;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .story {
                    grid-template-columns: 1fr;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-grid {
                    grid-template-columns: 1fr;
                }
            }


            @media (max-width: 860px) {
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .services {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }

                /* Grid de servicios inline también */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section [style*="grid-template-columns: repeat(3"] {
                    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
                }

                /* Footer inline */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) footer > div:first-of-type {
                    grid-template-columns: 1fr !important;
                    gap: 28px !important;
                }

                /* Banner ruta Europa ↔ Marruecos */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section [style*="display: flex"] {
                    flex-wrap: wrap;
                }
            }

            @media (max-width: 760px) {
                /* Padding general */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-inner {
                    padding: 22px 20px 34px;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section {
                    padding: 50px 20px;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .story {
                    padding: 0 20px 24px;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-wrap {
                    padding: 30px 20px 64px;
                }

                /* Footer padding */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) footer {
                    padding: 36px 20px 0 !important;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) footer > div:first-of-type {
                    grid-template-columns: 1fr !important;
                    gap: 24px !important;
                }

                /* Nav */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .nav {
                    flex-direction: column;
                    align-items: flex-start;
                    margin-bottom: 24px;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .nav-links {
                    flex-wrap: wrap;
                    gap: 12px;
                    width: 100%;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .lang-switcher,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .lang-switcher select {
                    width: 100%;
                }

                /* Servicios: 1 columna en móvil */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .services {
                    grid-template-columns: 1fr;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section [style*="grid-template-columns: repeat(3"] {
                    grid-template-columns: 1fr !important;
                }

                /* CTA checks */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .checks {
                    grid-template-columns: 1fr;
                }

                /* Formulario */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .form-row {
                    grid-template-columns: 1fr;
                }

                /* Botones */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-actions,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-actions {
                    flex-direction: column;
                    align-items: stretch;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .hero-actions .btn,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta-actions .btn {
                    width: 100%;
                    text-align: center;
                }

                /* Padding cards */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .glass-card,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .solid-card,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .panel,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta,
:where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .service {
                    padding: 24px 18px;
                }
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .cta {
                    border-radius: 22px;
                    padding: 28px 20px;
                }

                /* Topbar y footer text */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .topbar {
                    width: calc(100% - 24px);
                    font-size: 11px;
                }

                /* Banner ruta Europa ↔ Marruecos */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .section > div[style*="display: flex"] {
                    flex-direction: column;
                    gap: 10px !important;
                }

                /* Contact box padding */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .contact-box {
                    padding: 20px 16px;
                }

                /* Whatsapp botón flotante */
                :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .whatsapp {
                    right: 14px;
                    bottom: 14px;
                    width: 52px;
                    height: 52px;
                }
            }

            :where(html:has(template[data-centrum-style="public-ve-landingMarruecos"])) .text-justify {
                text-align: justify;
                text-justify: inter-word;
            }

/* templates/ve/modalSolicitarCotizacion.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .modal-dialog {
        max-width: 65% !important;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .dropdown-toggle {
        background-color: inherit;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 6px;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) input {
        border: 1px solid #ced4da;
        border-radius: 6px !important;
    }
    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) label {
        font-weight: 600;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .dropdown-toggle {
        background-color: inherit;
    }
    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .dropdown.bootstrap-select {
        border: 1px solid #ced4da;
        border-radius: 4px;
    }
    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .pac-container {
        z-index: 10000;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-item {
        max-width: 100%;
        max-height: fit-content;
        position: sticky;
        top: 20px;
        z-index: 1050;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-text a {
        font-weight: bold;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-box {
        border: 1px solid #a5aab7;
        border-radius: 8px;
        background-color: #f8f9fa;
        padding: 12px;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-box-item {
        display: flex;
        align-items: center;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-box svg {
        width: 20px;
        height: 20px;
        margin-right: 10px;
        fill: orange;
    }

    :where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-box span,
:where(html:has(template[data-centrum-style="public-ve-modalSolicitarCotizacion"])) .contact-box a {
        font-weight: bold;
        color: #05006c;
    }

/* templates/ve/resetPassword.html.twig — estilos conservados y delimitados por vista. */
/* ===== Sección (igual que .fz-login) ===== */
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact.bg-light {
        background:var(--ecl-blue-900,#06133a) !important;
        position:relative; overflow:hidden;
        padding:140px 22px 90px;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact::before {
        content:""; position:absolute; top:-160px; right:-120px;
        width:560px; height:560px; border-radius:50%;
        background:radial-gradient(circle at 30% 30%, rgba(255,122,0,.45), transparent 62%);
        filter:blur(8px); pointer-events:none;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact > * { position:relative; z-index:2; }

    /* ===== Cabecera (igual que .head) ===== */
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact .text-center.border-primary {
        margin-bottom:46px !important; color:#fff;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact .text-center.border-primary::before {
        content:"Centrum Trans";
        display:inline-block; font-size:.78rem; font-weight:900; letter-spacing:2.5px;
        text-transform:uppercase; color:var(--ecl-orange-400,#ff9d2e); margin-bottom:10px;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #section-contact #titulo {
        color:#fff !important;
        font-size:clamp(1.8rem,4vw,2.6rem); font-weight:900 !important;
        letter-spacing:-.02em; margin:0 !important; padding:0 !important;
    }

    /* ===== Tarjeta (igual que .fz-card) ===== */
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password {
        max-width:480px; margin:0 auto;
        background:#fff; border-radius:24px; padding:40px;
        box-shadow:0 40px 80px -34px rgba(0,0,0,.6);
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password::before {
        content:"🔑";
        width:56px; height:56px; border-radius:16px; display:grid; place-items:center;
        font-size:1.6rem; margin-bottom:18px;
        background:linear-gradient(135deg, rgba(255,122,0,.15), rgba(226,90,0,.15));
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .col-3 {
        flex:0 0 100%; max-width:100%; padding:0;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .form-group { margin-bottom:16px; }

    /* ===== Label + input (igual que .fld / .fz-in) ===== */
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password label {
        display:block; font-size:.82rem; font-weight:700; margin-bottom:6px; color:#0a1024;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .form-control {
        width:100%; height:auto; border:1.5px solid #e2e8f0; border-radius:12px;
        padding:13px 14px; font-size:15px; outline:none; background:#fff; color:#0a1024;
        transition:border-color .18s ease, box-shadow .18s ease;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .form-control:focus {
        border-color:var(--ecl-blue-500,#1749d8); box-shadow:0 0 0 4px rgba(23,73,216,.14);
    }

    /* ===== Botón (igual que .fz-cta--blue) ===== */
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .btn-primary {
        border:0; cursor:pointer; width:100%;
        padding:14px; border-radius:12px; font-weight:800; font-size:15px; color:#fff;
        background:var(--ecl-grad-blue,linear-gradient(135deg,#1749d8,#06133a));
        transition:transform .18s ease, filter .18s ease;
        margin-top:6px !important;
    }
    :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .btn-primary:hover,
:where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password .btn-primary:focus {
        transform:translateY(-2px); box-shadow:none;
    }

    @media (max-width:576px){
        :where(html:has(template[data-centrum-style="public-ve-resetPassword"])) #formulario_recuperar_password { padding:28px 22px; }
    }

/* templates/ve/vehiculosDisponibles.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas {
            color: var(--ecl-ink);
            background: var(--ecl-bg);
            padding-bottom: 40px;
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container > .text-center,
:where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div > .row > .text-center {
            padding: 20px 24px;
            background: var(--ecl-grad-blue);
            border: 1px solid var(--ecl-line);
            border-radius: var(--ecl-radius);
            box-shadow: var(--ecl-shadow);
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container > .text-center h2,
:where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div > .row > .text-center h2 {
            margin: 0;
            color: #fff !important;
            font-family: inherit;
            font-size: clamp(1.35rem, 2.5vw, 1.9rem);
            font-weight: 800 !important;
            line-height: 1.35;
            letter-spacing: -.02em;
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container > .text-center h2::after,
:where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div > .row > .text-center h2::after {
            content: "";
            display: block;
            width: 56px;
            height: 4px;
            margin: 14px auto 0;
            border-radius: 4px;
            background: var(--ecl-grad-orange);
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #map {
            border: 1px solid var(--ecl-line);
            border-radius: var(--ecl-radius);
            box-shadow: var(--ecl-shadow);
            background: var(--ecl-line);
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div {
            scroll-margin-top: 150px;
        }

        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div_tabla {
            padding: 20px;
            background: #fff;
            border: 1px solid var(--ecl-line);
            border-radius: var(--ecl-radius);
            box-shadow: var(--ecl-shadow);
        }

        @media (max-width: 767px) {
            :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container > .text-center,
:where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div > .row > .text-center {
                padding: 18px 16px;
            }

            :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas #div_tabla {
                padding: 12px;
            }
        }


        :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container {
            width: 100%;
            max-width: none;
            padding-left: 24px;
            padding-right: 24px;
        }

        @media (max-width: 767px) {
            :where(html:has(template[data-centrum-style="public-ve-vehiculosDisponibles"])) #tabla_cargas > .container {
                padding-left: 12px;
                padding-right: 12px;
            }
        }

/* templates/ve/verRutaCotizacion.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-listheader,
:where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-summary {
            color:red;
            font-weight: 900;
        }

        :where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-listsel,
:where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-listsel b {
            font-weight: 900;
        }

        :where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-directions tbody tr:nth-child(even) {
            background-color: #f2bfdc;
        }
        :where(html:has(template[data-centrum-style="public-ve-verRutaCotizacion"])) .adp-directions tbody tr:nth-child(odd) {
            background-color: white;
        }

/* templates/ve/vistaSubirDocumentacionExt.html.twig — estilos conservados y delimitados por vista. */
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page {
            --ecl-blue-900: #06133a;
            --ecl-blue-700: #0b2a6b;
            --ecl-blue-500: #1749d8;
            --ecl-orange-500: #ff7a00;
            --ecl-orange-600: #e25a00;
            --ecl-ink: #06133a;
            --ecl-mute: #50617e;
            --ecl-bg: #eef3ff;
            --ecl-line: #e4e8f1;
            background: var(--ecl-bg) !important;
            color: var(--ecl-ink);
            padding-bottom: 60px;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container {
            width: calc(100% - 48px);
            max-width: 1500px;
            padding: 0;
        }

        /* Título principal */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row:first-child {
            margin: 0 0 24px;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row:first-child > div {
            position: relative;
            overflow: hidden;
            padding: 30px 34px;
            border: 0 !important;
            border-radius: 18px;
            background: linear-gradient(135deg, var(--ecl-blue-500) 0%, var(--ecl-blue-900) 100%);
            box-shadow: 0 22px 50px -32px rgba(6, 19, 58, .6);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row:first-child > div::after {
            content: "";
            position: absolute;
            top: -85px;
            right: -55px;
            width: 250px;
            height: 250px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 122, 0, .42), transparent 66%);
            pointer-events: none;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page h2 {
            position: relative;
            z-index: 1;
            margin: 0;
            color: #fff !important;
            font-size: clamp(1.55rem, 3vw, 2.15rem);
            font-weight: 900 !important;
            line-height: 1.3;
            letter-spacing: -.025em;
        }

        /* Resumen de la oferta */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row.form-group.col-12 {
            margin: 0 0 24px;
            padding: 26px 28px;
            border: 1px solid var(--ecl-line);
            border-radius: 18px;
            background: #fff;
            box-shadow: 0 22px 50px -34px rgba(6, 19, 58, .45);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row.form-group.col-12 > .col-md-6 {
            font-size: .92rem;
            line-height: 2;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row.form-group.col-12 > .col-md-6:first-child {
            border-right: 1px solid var(--ecl-line);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page strong {
            color: var(--ecl-blue-900);
        }

        /* Tabla */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .table-responsive {
            overflow-x: auto;
            border: 1px solid var(--ecl-line);
            border-radius: 14px;
            background: #fff;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas {
            width: 100% !important;
            margin: 0 !important;
            border-collapse: separate !important;
            border-spacing: 0 !important;
            background: #fff;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas thead,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas thead.bg-primary {
            background: var(--ecl-blue-900) !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas thead th {
            padding: 14px 13px !important;
            border: 0 !important;
            border-bottom: 4px solid var(--ecl-orange-500) !important;
            background: var(--ecl-blue-900) !important;
            color: #fff !important;
            font-size: .72rem !important;
            font-weight: 700 !important;
            letter-spacing: .45px;
            line-height: 1.4;
            text-transform: uppercase;
            vertical-align: middle;
            white-space: nowrap;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas tbody td {
            padding: 15px 13px !important;
            border: 0 !important;
            border-right: 1px solid #f0f2f7 !important;
            border-bottom: 1px solid var(--ecl-line) !important;
            color: var(--ecl-ink);
            font-size: .8rem;
            line-height: 1.6;
            vertical-align: top;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas tbody td:last-child {
            border-right: 0 !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas tbody tr:nth-child(even) {
            background: #fafbfe;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas tbody tr:hover {
            background: #eef3ff;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas tbody td:first-child {
            color: var(--ecl-blue-500);
            font-weight: 800;
            text-align: center;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas img {
            display: inline-block;
            margin-right: 6px;
            border-radius: 3px;
            box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
            vertical-align: middle;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #tabla-cargas hr {
            margin: 9px 0;
            border-color: var(--ecl-line);
        }

        /* Controles DataTables */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper .dataTables_length,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper .dataTables_filter {
            margin-bottom: 14px;
            color: var(--ecl-mute);
            font-size: .85rem;
            font-weight: 600;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper input,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper select {
            min-height: 38px;
            padding: 7px 11px !important;
            border: 1.5px solid #e2e8f0 !important;
            border-radius: 9px !important;
            background: #fff;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper input:focus,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper select:focus {
            border-color: var(--ecl-blue-500) !important;
            outline: 0;
            box-shadow: 0 0 0 3px rgba(23, 73, 216, .12);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper .paginate_button {
            border-radius: 8px !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper .paginate_button.current,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .dataTables_wrapper .paginate_button.current:hover {
            border-color: var(--ecl-blue-500) !important;
            background: var(--ecl-blue-500) !important;
            color: #fff !important;
        }

        /* Formulario de documentos */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion {
            margin: 0;
            padding: 28px !important;
            border: 1px solid var(--ecl-line);
            border-radius: 18px;
            background: #fff !important;
            box-shadow: 0 22px 50px -34px rgba(6, 19, 58, .45);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion > .container {
            width: 100%;
            max-width: none;
            margin: 0;
            padding: 0;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion > .container > label {
            width: 100%;
            margin: 0 15px 18px;
            padding: 14px 16px;
            border-left: 4px solid var(--ecl-orange-500);
            border-radius: 0 10px 10px 0;
            background: #f7f9fd;
            color: var(--ecl-blue-900);
            font-weight: 800;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion .col-md-4 {
            margin-top: 0 !important;
            margin-bottom: 24px !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion label {
            margin-bottom: 8px;
            color: var(--ecl-ink) !important;
            font-size: .86rem;
            font-weight: 700;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion .form-control {
            min-height: 45px;
            height: auto !important;
            padding: 10px 12px !important;
            border: 1.5px solid #e2e8f0 !important;
            border-radius: 10px !important;
            background: #fff;
            color: var(--ecl-ink);
            font-size: 14px;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion .form-control:focus {
            border-color: var(--ecl-blue-500) !important;
            outline: 0;
            box-shadow: 0 0 0 4px rgba(23, 73, 216, .12) !important;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #boton_enviar {
            min-width: 190px;
            min-height: 46px;
            padding: 11px 28px !important;
            border: 0 !important;
            border-radius: 10px;
            background: linear-gradient(135deg, var(--ecl-orange-500), var(--ecl-orange-600)) !important;
            box-shadow: 0 14px 28px -16px rgba(255, 122, 0, .85);
            color: #fff !important;
            font-weight: 800;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #boton_enviar:hover {
            transform: translateY(-1px);
            filter: brightness(1.05);
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #boton_enviar:disabled {
            transform: none;
            opacity: .6;
            box-shadow: none;
        }

        /* Mensaje cuando ya no se admiten documentos */
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > div[style*="text-align: center"]:last-child {
            padding: 24px;
            border: 1px solid #ffd8c2;
            border-left: 5px solid var(--ecl-orange-600);
            border-radius: 14px;
            background: #fff5ed;
        }
        :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > div[style*="text-align: center"]:last-child b {
            color: var(--ecl-orange-600) !important;
            font-size: 1.15rem !important;
        }

        @media (max-width: 991.98px) {
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row.form-group.col-12 > .col-md-6:first-child {
                margin-bottom: 12px;
                padding-bottom: 12px;
                border-right: 0;
                border-bottom: 1px solid var(--ecl-line);
            }
        }
        @media (max-width: 767.98px) {
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container {
                width: calc(100% - 24px);
            }
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row:first-child > div {
                padding: 24px 20px;
                border-radius: 14px;
            }
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page > .container > .row.form-group.col-12,
:where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #formulario_subir_documentacion {
                padding: 20px 16px !important;
                border-radius: 14px;
            }
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page .mt-5.mb-5.col-12 {
                padding-left: 0;
                padding-right: 0;
            }
            :where(html:has(template[data-centrum-style="public-ve-vistaSubirDocumentacionExt"])) #section-contact.ecl-document-page #boton_enviar {
                width: 100%;
            }
        }

/* Identidad común de pantallas públicas: reutiliza la paleta y los componentes aprobados. */
body.centrum-public { --ecl-bg: var(--ecl-public-paper); --ecl-paper: #ffffff; --ecl-soft: var(--ecl-public-soft); --ecl-ink: var(--ecl-public-ink); --ecl-mute: var(--ecl-public-mute); --ecl-line: var(--ecl-public-line); --ecl-radius: 12px; --ecl-shadow: 0 5px 18px -14px rgba(6,19,58,.28); --ecl-grad-blue: linear-gradient(110deg,var(--ecl-blue-500),#245ce8); }
body.centrum-public-screen { background: var(--ecl-public-paper); color: var(--ecl-ink); font-size: 14px; line-height: 1.6; }
body.centrum-public-screen :is(.site-section.bg-light,.ecl-contact-page,.ecl-route-page,#tabla_cargas) { background: var(--ecl-public-paper) !important; color: var(--ecl-ink); }
body.centrum-public-screen #tabla_cargas { padding-top: 28px !important; padding-bottom: 32px; }
body.centrum-public-screen :is(.container,.ecl-route-section,.ecl-contact-section) { max-width: 1180px; }
body.centrum-public-screen :is(h1,h2,h3) { color: var(--ecl-ink); }
body.centrum-public-screen :is(.ecl-hero,.site-blocks-cover) :is(h1,h2) { color: #fff !important; }
body.centrum-public-screen :is(.ecl-hero,.site-blocks-cover) { background: var(--ecl-grad-blue) !important; }
body.centrum-public-screen .site-blocks-cover.overlay::before { background: transparent !important; }
body.centrum-public-screen :is(.card,.ecl-card,.ecl-contact-form,.ecl-contact-message,.ecl-route-sidebar,.documento-item) { background: var(--ecl-paper); border-color: var(--ecl-line); border-radius: 12px; box-shadow: var(--ecl-shadow); }
body.centrum-public-screen :is(.card-header,.card-header-1) { background: var(--ecl-soft); color: var(--ecl-ink); padding: 10px 14px; border-bottom: 1px solid var(--ecl-line); font-weight: 600; }
:is(body.centrum-public-screen,body.centrum-public .modal) :is(.form-control,.fz-in) { min-height: 36px; border: 1px solid var(--ecl-line) !important; border-radius: 6px !important; background: #fff; color: var(--ecl-ink); font-size: 13px !important; padding: 7px 10px !important; }
:is(body.centrum-public-screen,body.centrum-public .modal) :is(.form-control,.fz-in):focus { outline: 0; border-color: var(--ecl-blue-500) !important; box-shadow: 0 0 0 3px rgba(22,72,232,.12) !important; }
:is(body.centrum-public-screen,body.centrum-public .modal) :is(.form-control,.fz-in):is([readonly],:disabled) { background: var(--ecl-soft); color: var(--ecl-mute); }
body.centrum-public-screen :is(textarea,.form-control[multiple]) { max-width: 100%; }
:is(body.centrum-public-screen,body.centrum-public .modal) label { font-size: 12px; font-weight: 500; color: var(--ecl-ink); }
:is(body.centrum-public-screen,body.centrum-public .modal) :is(.btn,.ecl-btn,.fz-cta) { border-radius: 6px !important; font-size: 13px !important; font-weight: 600; line-height: 1.4; padding: 8px 14px; box-shadow: none !important; }
body.centrum-public-screen :is(.btn-primary,.ecl-btn--blue,.fz-cta--blue) { background: var(--ecl-blue-500) !important; border-color: var(--ecl-blue-500) !important; color: #fff !important; }
body.centrum-public-screen :is(.btn-warning,.ecl-btn--orange,.fz-cta--orange) { background: var(--ecl-orange-500) !important; border-color: var(--ecl-orange-500) !important; color: var(--ecl-ink) !important; }
body.centrum-public-screen .btn-success { background: #147b57 !important; border-color: #147b57 !important; color: #fff !important; }
body.centrum-public-screen .btn-danger { background: #c92f4f !important; border-color: #c92f4f !important; color: #fff !important; }
body.centrum-public-screen :is(.table,.stripe,.display,table.dataTable,.ecl-load-table) { font-size: 12px; width: 100%; border-color: var(--ecl-line); }
body.centrum-public-screen :is(.table,.stripe,.display,table.dataTable,.ecl-load-table) thead th { background: var(--ecl-soft) !important; color: var(--ecl-ink) !important; border-bottom-color: var(--ecl-blue-500) !important; font-size: 12px; }
body.centrum-public-screen :is(.table,.stripe,.display,table.dataTable,.ecl-load-table) tbody td { border-color: var(--ecl-line); vertical-align: top; }
body.centrum-public-auth .fz-login,body.centrum-public-auth #section-contact.bg-light { background: var(--ecl-public-paper) !important; color: var(--ecl-ink); padding: 40px 20px; }
body.centrum-public-auth .fz-login::before { background: transparent; }
body.centrum-public-auth .fz-login .head { color: var(--ecl-ink); margin-bottom: 24px; }
body.centrum-public-auth .fz-login .head .kick { color: var(--ecl-orange-600); }
body.centrum-public-auth .fz-card { border-radius: 12px; border-color: var(--ecl-line); box-shadow: var(--ecl-shadow); }
body.centrum-public-auth .fz-card.accent { background: var(--ecl-blue-900); }
body.centrum-public-auth .fz-card.accent :is(h3,label,.sub,.note) { color: #fff; }
body.centrum-public-auth #section-contact #titulo { color: var(--ecl-ink) !important; margin-top: 0 !important; padding-top: 0 !important; }
body.centrum-public-auth .form-contact { background: var(--ecl-paper); border: 1px solid var(--ecl-line); border-radius: 12px; padding: 24px; width: 100%; max-width: 600px; margin: 0 auto; box-shadow: var(--ecl-shadow); }
body.centrum-public-auth .form-contact .row > :is(.col-3,.col-4) { flex: 0 0 100%; max-width: 100%; }
body.centrum-public-auth #formulario_recuperar_password { background: var(--ecl-paper); border-color: var(--ecl-line); border-radius: 12px; }
body.centrum-public-docs #section-contact.ecl-document-page { --ecl-bg: var(--ecl-public-paper); --ecl-ink: var(--ecl-public-ink); --ecl-mute: var(--ecl-public-mute); --ecl-line: var(--ecl-public-line); background: var(--ecl-public-paper) !important; }
body.centrum-public-docs #section-contact.ecl-document-page > .container { max-width: 1180px; }
body.centrum-public-route .adp-directions tbody tr:nth-child(even) { background: var(--ecl-soft) !important; }
body.centrum-public-route :is(.adp-listheader,.adp-summary) { color: var(--ecl-ink) !important; font-weight: 600; }
body.centrum-public-route .adp-directions tbody tr:nth-child(odd) { background: var(--ecl-paper) !important; }
body.centrum-public-route :is(#map-detalle-trayecto,#panel) { border-radius: 10px; border-color: var(--ecl-line); }
body.centrum-public-landing { --bg: var(--ecl-public-paper); --bg-2: var(--ecl-paper); --surface-solid: var(--ecl-paper); --primary: var(--ecl-blue-900); --primary-2: var(--ecl-blue-500); --accent: var(--ecl-orange-500); --accent-2: var(--ecl-orange-400); --soft-blue: var(--ecl-public-soft); --text: var(--ecl-ink); --muted: var(--ecl-mute); background: var(--ecl-public-paper); color: var(--ecl-ink); }
body.centrum-public-landing .btn-primary { color: var(--ecl-ink); }
body.centrum-public-landing :is(.glass-card,.card,.form-card) { border-color: var(--ecl-line); }
body.centrum-internal #calendar { --fc-button-bg-color: var(--ecl-blue-500); --fc-button-border-color: var(--ecl-blue-500); --fc-button-hover-bg-color: var(--ecl-blue-900); --fc-button-hover-border-color: var(--ecl-blue-900); --fc-button-active-bg-color: var(--ecl-blue-900); --fc-button-active-border-color: var(--ecl-blue-900); --fc-border-color: var(--ecl-line); --fc-today-bg-color: var(--ecl-warm); }
body.centrum-internal #calendar .fc-button-primary { background: var(--ecl-blue-500); border-color: var(--ecl-blue-500); color: #fff; border-radius: 6px; font-size: 12px; }
body.centrum-internal #calendar .fc-button-primary:is(:hover,.fc-button-active) { background: var(--ecl-blue-900); border-color: var(--ecl-blue-900); }
body.centrum-internal #calendar .fc-button-primary:focus-visible { outline: 2px solid var(--ecl-orange-500); outline-offset: 2px; }
body.centrum-internal #calendar .fc-toolbar-title { font-size: 18px; color: var(--ecl-ink); }
:where(html:has(template[data-centrum-style="vi-mapaTracking-0"])) body.centrum-internal #panel-cargas { background: var(--ecl-blue-900) !important; border-color: var(--ecl-line); box-shadow: var(--ecl-shadow); }
:where(html:has(template[data-centrum-style="vi-mapaTracking-0"])) body.centrum-internal #panel-cargas .list-group-item:first-of-type { background: var(--ecl-grad-blue) !important; }
@media(max-width:767px) {
    body.centrum-public-screen :is(.container,.ecl-route-section,.ecl-contact-section) { max-width: 100%; }
    body.centrum-public-auth .fz-login { padding: 28px 16px; }
    body.centrum-public-screen .form-contact { padding: 16px; }
    body.centrum-public-route .section_mapa > .row > :is(#panel,#map-detalle-trayecto) { flex: 0 0 100%; max-width: 100%; }
    body.centrum-internal #calendar .fc-toolbar { flex-wrap: wrap; gap: 8px; }
}

body.centrum-public-screen :is(.ecl-contact-section,.ecl-route-section) { padding-top: 28px; padding-bottom: 32px; }
body.centrum-public-screen > .container[style*="padding-top"] { padding-top: 28px !important; }
body.centrum-public-docs #section-contact.ecl-document-page { padding-top: 28px !important; }
body.centrum-public-auth #section-contact .text-center.border-primary::before { color: var(--ecl-orange-600); }
body.centrum-public .modal-body .container.row { width: 100%; max-width: 100%; margin-left: 0; margin-right: 0; }
body.centrum-public .modal-body :is(.row,.form-row) { min-width: 0; }
body.centrum-public .modal-body textarea { max-width: 100%; }
@media(max-width:767px) { body.centrum-public .modal-body .col-8.row { flex: 0 0 100%; max-width: 100%; } }

body.centrum-public .site-mobile-menu { background: var(--ecl-paper); color: var(--ecl-ink); border-left: 2px solid var(--ecl-orange-500); }
body.centrum-public .site-mobile-menu .site-nav-wrap > li > a { color: var(--ecl-ink); }
body.centrum-public .site-mobile-menu .site-nav-wrap > li.active > a { color: var(--ecl-blue-500); }
body.centrum-public .modal-body .title :is(h2,h3,h4,h5) { color: var(--ecl-ink) !important; font-size: 13px !important; font-weight: 600 !important; }
body.centrum-public .modal-body :is(.row,.container.row) { margin-left: 0; margin-right: 0; }
:is(body.centrum-public-screen,body.centrum-public .modal) .form-control.is-invalid,
:is(body.centrum-public-screen,body.centrum-public .modal) .form-control[aria-invalid=true] { border-color: #c92f4f !important; }
:is(body.centrum-public-screen,body.centrum-public .modal) .form-control.is-valid { border-color: #147b57 !important; }

body.centrum-public-screen .ecl-hero { border-radius: 12px; box-shadow: inset 0 -2px 0 var(--ecl-orange-500),var(--ecl-shadow); }
body.centrum-public .modal .input-group > .form-control { min-width: 0; }
@media(max-width:767px) { body.centrum-public .modal .modal-dialog { width: calc(100% - 24px) !important; max-width: calc(100% - 24px) !important; margin: 12px auto; } }

/* Landing de Marruecos: misma identidad y acciones que la portada. */
body.centrum-public-landing .page { background: var(--ecl-public-paper); }
body.centrum-public-landing :is(.hero-inner,.section,.shell) { max-width: 1180px; }
body.centrum-public-landing .stripe div:nth-child(1) { background: var(--ecl-blue-900); }
body.centrum-public-landing .stripe div:nth-child(2) { background: var(--ecl-blue-500); }
body.centrum-public-landing .stripe div:nth-child(3) { background: var(--ecl-orange-500); }
body.centrum-public-landing .stripe div:nth-child(4) { background: var(--ecl-public-soft); }
body.centrum-public-landing .btn { min-height: 44px; border-radius: 30px; font-size: 13px; padding: 10px 20px; box-shadow: none !important; }
body.centrum-public-landing .btn-primary,body.centrum-public-landing .form-submit .btn { background: var(--ecl-orange-500) !important; border-color: var(--ecl-orange-500) !important; color: var(--ecl-ink) !important; }
body.centrum-public-landing .panel:not(.panel-dark),body.centrum-public-landing .contact-form { background: var(--ecl-paper); border-color: var(--ecl-line); border-radius: 14px; }
body.centrum-public-landing .form-field :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { border: 1px solid var(--ecl-line); border-radius: 6px; font-size: 13px; }
body.centrum-public-landing :is(.radio-group,.form-check) input { accent-color: var(--ecl-blue-500); }

/* Crear incidencia: controles originales, misma familia visual y distribución compacta. */
body.centrum-internal .modal-body > .container.row > .col-md-12:has(> #formulario_nueva_incidencia) { margin-bottom: 0 !important; }
body.centrum-internal #formulario_nueva_incidencia .form-row { gap: 12px; margin: 0; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group { flex: 0 0 calc(50% - 6px); max-width: calc(50% - 6px); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: start; gap: 8px; padding: 12px; margin: 0; border: 1px solid var(--ecl-line); border-radius: 8px; background: var(--ecl-paper); box-shadow: none; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group > label { grid-column: 1 / -1; min-height: 30px; font-weight: 600 !important; margin: 0 !important; color: var(--ecl-ink); }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group > label > i { margin-right: 6px; color: var(--ecl-blue-500); font-size: 16px; vertical-align: -2px; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group > br { display: none; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group > .form-group { position: relative; min-width: 0; margin: 0 !important; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group input[type=radio] { position: absolute; z-index: 1; left: 10px; top: 12px; width: 14px; height: 14px; margin: 0; accent-color: var(--ecl-blue-500); }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group input[type=radio] + label { display: block; min-height: 38px; padding: 9px 8px 9px 32px; margin: 0 !important; border: 1px solid var(--ecl-line); border-radius: 6px; background: #fff; color: var(--ecl-ink); cursor: pointer; line-height: 18px; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group input[type=radio]:checked + label { border-color: var(--ecl-blue-500); background: var(--ecl-soft); font-weight: 600; }
body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group input[type=radio]:focus-visible + label { outline: 2px solid var(--ecl-blue-500); outline-offset: 2px; }
body.centrum-internal #formulario_nueva_incidencia #bloqueante_si:checked + label { border-color: #c92f4f; background: #fff0f3; color: #91223c; }
body.centrum-internal #formulario_nueva_incidencia #bloqueante_no:checked + label { border-color: #147b57; background: #edf8f3; color: #116244; }
body.centrum-internal #formulario_nueva_incidencia .form-row > .form-group:not(.ecl-incidence-group) { padding: 0; margin: 0 !important; }
body.centrum-internal #formulario_nueva_incidencia textarea#incidencia { min-height: 120px; padding: 9px 11px; border: 1px solid var(--ecl-line); border-radius: 6px; font-size: 13px; line-height: 1.5; background: #fff; color: var(--ecl-ink); resize: vertical; }
body.centrum-internal #formulario_nueva_incidencia .actions { justify-content: flex-end !important; gap: 8px; margin: 12px 0 0 !important; padding-top: 12px; border-top: 1px solid var(--ecl-line); }
body.centrum-internal #formulario_nueva_incidencia .actions .btn { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 7px 14px !important; }
@media(max-width:600px) { body.centrum-internal #formulario_nueva_incidencia .ecl-incidence-group { flex-basis: 100%; max-width: 100%; } }