/* /Layout/Generics/NoRegistros.razor.rz.scp.css */
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-k4lz5e70kq] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-k4lz5e70kq] {
    flex: 1;
}

.sidebar[b-k4lz5e70kq] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-k4lz5e70kq] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-k4lz5e70kq]  a, .top-row[b-k4lz5e70kq]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-k4lz5e70kq]  a:hover, .top-row[b-k4lz5e70kq]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-k4lz5e70kq]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-k4lz5e70kq] {
        justify-content: space-between;
    }

    .top-row[b-k4lz5e70kq]  a, .top-row[b-k4lz5e70kq]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-k4lz5e70kq] {
        flex-direction: row;
    }

    .sidebar[b-k4lz5e70kq] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-k4lz5e70kq] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-k4lz5e70kq]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-k4lz5e70kq], article[b-k4lz5e70kq] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Layout/MainLayoutLogin.razor.rz.scp.css */
.page[b-anbqtbgpa4] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-anbqtbgpa4] {
    flex: 1;
}

.sidebar[b-anbqtbgpa4] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-anbqtbgpa4] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-anbqtbgpa4]  a, .top-row[b-anbqtbgpa4]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-anbqtbgpa4]  a:hover, .top-row[b-anbqtbgpa4]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-anbqtbgpa4]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-anbqtbgpa4] {
        justify-content: space-between;
    }

    .top-row[b-anbqtbgpa4]  a, .top-row[b-anbqtbgpa4]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-anbqtbgpa4] {
        flex-direction: row;
    }

    .sidebar[b-anbqtbgpa4] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-anbqtbgpa4] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-anbqtbgpa4]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-anbqtbgpa4], article[b-anbqtbgpa4] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-u28y5utnsf] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-u28y5utnsf] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-u28y5utnsf] {
    font-size: 1.1rem;
}

.bi[b-u28y5utnsf] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-u28y5utnsf] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-u28y5utnsf] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-u28y5utnsf] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-u28y5utnsf] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-u28y5utnsf] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-u28y5utnsf] {
        padding-bottom: 1rem;
    }

    .nav-item[b-u28y5utnsf]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-u28y5utnsf]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-u28y5utnsf]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-u28y5utnsf] {
        display: none;
    }

    .collapse[b-u28y5utnsf] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
    
    .nav-scrollable[b-u28y5utnsf] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Pages/Logisticos/UltimaMilla/TransportistaPageRZ.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   TransportistaPageRZ.razor.css
   Basado en UltimaMillaPageRZ — sin KPIs, con chips de resumen
   ═══════════════════════════════════════════════════════ */

.um-page[b-nm30sql402] {
    --bg: #f5f7fb;
    --white: #ffffff;
    --border: #e2e6f0;
    --text: #23304d;
    --muted: #6d7893;
    --primary: #4f5dff;
    --shadow: 0 2px 10px rgba(28,42,80,.07);
    --r: 14px;
    background: var(--bg);
    padding: 0 0 2rem;
    min-height: 100%;
}

/* ── Breadcrumb ─────────────────────────────────────────── */
.um-breadcrumb[b-nm30sql402] {
    margin: .5rem 0 .5rem;
}

/* ── Títulos ────────────────────────────────────────────── */
.um-title[b-nm30sql402] {
    margin: 0 0 .2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}

.um-subtitle[b-nm30sql402] {
    margin: 0 0 1rem;
    color: var(--muted);
    font-size: .95rem;
}

/* ══════════════════════════════════════════════════════════
   CHIPS DE RESUMEN (reemplazan KPIs)
   ══════════════════════════════════════════════════════════ */
.um-chips-row[b-nm30sql402] {
    display: flex;
    gap: .75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.um-summary-chip[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .65rem;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: var(--shadow);
    padding: .55rem 1.1rem;
    min-width: 160px;
}

.um-summary-chip-lbl[b-nm30sql402] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.um-summary-chip-val[b-nm30sql402] {
    margin-left: auto;
    background: #edf3ff;
    color: #4f5dff;
    font-size: 1.1rem;
    font-weight: 800;
    border-radius: 20px;
    min-width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 .6rem;
}

.um-summary-chip--proceso .um-summary-chip-val[b-nm30sql402] {
    background: #fff4dd;
    color: #d48a08;
}

/* ── Toolbar ────────────────────────────────────────────── */
.um-toolbar[b-nm30sql402] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .7rem 1rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.um-toolbar-filters[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex: 1;
    min-width: 0;
    flex-wrap: wrap;
}

.um-toolbar-actions[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-shrink: 0;
    flex-wrap: wrap;
}

/* ── Estados vacíos / loader ────────────────────────────── */
.um-loader-wrap[b-nm30sql402] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: 2rem 0;
    color: var(--muted);
}

.um-state[b-nm30sql402] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
}

/* ── Feed ───────────────────────────────────────────────── */
.um-feed[b-nm30sql402] {
    display: flex;
    flex-direction: column;
}

/* ═══════════════════════════════════════════════════════
   CARD
   ═══════════════════════════════════════════════════════ */
.um-card[b-nm30sql402] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    margin-bottom: .7rem;
    transition: box-shadow .15s;
}

    .um-card:hover[b-nm30sql402] {
        box-shadow: 0 4px 18px rgba(79,93,255,.1);
    }

/* ── TOP ROW ────────────────────────────────────────────── */
.um-card-top[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
}

.um-transport-box[b-nm30sql402] {
    width: 38px;
    min-width: 38px;
    height: 38px;
    border-radius: 11px;
    background: #eff3ff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .um-transport-box[b-nm30sql402]  .rzi {
        font-size: 1.2rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
        max-width: none !important;
        max-height: none !important;
    }

.um-identity[b-nm30sql402] {
    display: flex;
    flex-direction: column;
    gap: .22rem;
    flex: 1;
    min-width: 0;
}

.um-identity-row1[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.um-lbl[b-nm30sql402] {
    font-size: .78rem;
    color: var(--muted);
    font-weight: 500;
    white-space: nowrap;
}

.um-ref[b-nm30sql402] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--text);
    white-space: nowrap;
}

.um-identity-row2[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .3rem;
    flex-wrap: wrap;
    font-size: .83rem;
    color: var(--muted);
}

    .um-identity-row2[b-nm30sql402]  .rzi {
        font-size: .85rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.um-tipo[b-nm30sql402] {
    color: var(--muted);
}

.um-sep[b-nm30sql402] {
    color: var(--border);
    padding: 0 .05rem;
}

.um-cliente[b-nm30sql402] {
    color: var(--text);
    font-weight: 600;
}

.um-top-right[b-nm30sql402] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .38rem;
    margin-left: auto;
    flex-shrink: 0;
}

.um-inicio-lbl[b-nm30sql402] {
    font-size: .78rem;
    color: var(--muted);
    white-space: nowrap;
}

/* ── DIVISOR ────────────────────────────────────────────── */
.um-card-divider[b-nm30sql402] {
    height: 1px;
    background: var(--border);
}

/* ═══════════════════════════════════════════════════════
   CARD BOTTOM
   ═══════════════════════════════════════════════════════ */
.um-card-bottom[b-nm30sql402] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    flex-wrap: nowrap;
}

.um-info-grid[b-nm30sql402] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    flex: 1;
    min-width: 0;
}

.um-info-pair[b-nm30sql402] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    flex-shrink: 0;
}

.um-info-item[b-nm30sql402] {
    display: flex;
    flex-direction: column;
    gap: .05rem;
    min-width: 0;
}

.um-info-grid .um-info-pair + .um-info-pair[b-nm30sql402] {
    padding-left: 1.25rem;
    border-left: 1px solid var(--border);
}

.um-route-arrows[b-nm30sql402] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .2rem;
    opacity: .5;
    flex-shrink: 0;
    padding-top: .25rem;
}

    .um-route-arrows[b-nm30sql402]  .rzi {
        font-size: 1rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
        color: #c0c9dc;
    }

.um-stop-lbl[b-nm30sql402] {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    color: var(--muted);
    white-space: nowrap;
}

.um-stop-val[b-nm30sql402] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

/* ── Acciones ───────────────────────────────────────────── */
.um-card-actions[b-nm30sql402] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-shrink: 0;
    margin-left: auto;
}

/* ── Status chips ───────────────────────────────────────── */
.um-chip[b-nm30sql402] {
    display: inline-flex;
    align-items: center;
    padding: .18rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
    line-height: 1.5;
}

.um-chip-abierto[b-nm30sql402] {
    background: #e9f1ff;
    color: #3070f2;
}

.um-chip-proceso[b-nm30sql402] {
    background: #fff1d8;
    color: #d48a08;
}

.um-chip-terminado[b-nm30sql402] {
    background: #e6f7ef;
    color: #3ca57e;
}

.um-chip-cancelado[b-nm30sql402] {
    background: #ffe7e7;
    color: #d94b4b;
}

.um-chip-pendiente[b-nm30sql402] {
    background: #efeff4;
    color: #717388;
}

.um-chip-solicitado[b-nm30sql402] {
    background: #edeaff;
    color: #6b5cff;
}

.um-chip-rechazado[b-nm30sql402] {
    background: #fde8e8;
    color: #c0392b;
}

/* ── Paginador ──────────────────────────────────────────── */
.um-pager-wrap[b-nm30sql402] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .6rem 1rem;
    margin-top: .25rem;
    margin-bottom: .75rem;
    display: flex;
    justify-content: center;
}

.um-end-label[b-nm30sql402] {
    text-align: center;
    padding: 1rem 0 .5rem;
    font-size: .82rem;
    color: var(--muted);
    letter-spacing: .03em;
}

/* ── Overlay de carga ───────────────────────────────────── */
.um-overlay[b-nm30sql402] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.55);
    z-index: 9999;
    backdrop-filter: blur(2px);
}

.um-loader[b-nm30sql402] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    padding: 1.25rem 1.75rem;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */

/* 960px — toolbar apilado */
@media (max-width: 960px) {
    .um-toolbar[b-nm30sql402] {
        flex-direction: column;
        align-items: stretch;
    }

    .um-toolbar-filters[b-nm30sql402] {
        flex-direction: column;
    }

    .um-toolbar-actions[b-nm30sql402] {
        justify-content: flex-start;
    }

    .um-chips-row[b-nm30sql402] {
        gap: .5rem;
    }

    .um-summary-chip[b-nm30sql402] {
        min-width: 0;
        flex: 1;
    }
}

/* ── 768px — MOBILE ─────────────────────────────────────── */
@media (max-width: 768px) {

    .um-card-top[b-nm30sql402] {
        flex-wrap: wrap;
        gap: .6rem;
    }

    .um-top-right[b-nm30sql402] {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-left: 0;
        order: 3;
    }

    .um-card-bottom[b-nm30sql402] {
        flex-direction: column;
        gap: .75rem;
    }

    .um-route-arrows[b-nm30sql402] {
        display: none;
    }

    .um-info-grid[b-nm30sql402] {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .75rem;
    }

    .um-info-pair[b-nm30sql402] {
        flex-direction: column;
        gap: .55rem;
        padding-left: 0 !important;
        border-left: none !important;
    }

    .um-info-grid .um-info-pair:last-child[b-nm30sql402] {
        padding-left: .75rem !important;
        border-left: 1px solid var(--border) !important;
    }

    /* Acciones: 2 botones lado a lado a ancho completo */
    .um-card-actions[b-nm30sql402] {
        width: 100%;
        margin-left: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .5rem;
    }

        .um-card-actions[b-nm30sql402]  .rz-button {
            width: 100% !important;
            justify-content: center !important;
        }

    .um-stop-val[b-nm30sql402] {
        max-width: 100%;
        white-space: normal;
    }

    .um-chips-row[b-nm30sql402] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .um-summary-chip[b-nm30sql402] {
        flex: 1 1 calc(50% - .375rem);
        min-width: 130px;
    }

    .um-pager-wrap[b-nm30sql402] {
        padding: .5rem;
    }
}

/* ── 480px — Teléfonos pequeños ─────────────────────────── */
@media (max-width: 480px) {

    .um-page[b-nm30sql402] {
        padding: 0 0 1.5rem;
    }

    .um-title[b-nm30sql402] {
        font-size: 1.4rem;
    }

    .um-card[b-nm30sql402] {
        padding: .8rem .85rem;
    }

    /* Chips en fila completa */
    .um-summary-chip[b-nm30sql402] {
        flex: 1 1 100%;
    }

    .um-ref[b-nm30sql402] {
        white-space: normal;
        word-break: break-all;
    }

    .um-info-grid[b-nm30sql402] {
        gap: .5rem;
    }

    .um-card-actions[b-nm30sql402] {
        grid-template-columns: 1fr 1fr;
    }

    .um-stop-val[b-nm30sql402] {
        max-width: 100%;
        white-space: normal;
    }
}
/* /Pages/Logisticos/UltimaMilla/UltimaMillaDetPageRZ.razor.rz.scp.css */
/* ============================================================
   SOLICITUD DE SERVICIO — Modal Form Styles
   Responsive: móvil · tableta · escritorio · pantalla grande
   ============================================================ */

/* ── Variables ─────────────────────────────────────────────── */
:root[b-np9quihycf] {
    --soli-border: #e2e6f0;
    --soli-label: #7b8a9b;
    --soli-val: #23304d;
    --soli-accent: #4f5dff;
    --soli-radius: 8px;
    --soli-gap: 1rem;
}

/* ── Contenedor principal ──────────────────────────────────── */
.soli-modal[b-np9quihycf] {
    position: relative; /* necesario para el overlay */
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #fff;
    border-radius: 12px;
    min-height: 100%;
}

/* ── Spinner overlay ───────────────────────────────────────── */
.soli-spinner-overlay[b-np9quihycf] {
    position: absolute;
    inset: 0;
    z-index: 200;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.soli-spinner-card[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid var(--soli-border);
    border-radius: 16px;
    padding: 2rem 3rem;
    box-shadow: 0 8px 32px rgba(79, 93, 255, 0.12);
}

.soli-spinner-txt[b-np9quihycf] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--soli-accent);
    letter-spacing: 0.02em;
}

/* ── Secciones ─────────────────────────────────────────────── */
.soli-section[b-np9quihycf] {
    padding: 1.25rem 1.5rem;
}

/* La sección de mercancías no restringe su ancho interior */
.soli-section--mercancias[b-np9quihycf] {
    overflow-x: auto;
}

.soli-section-hdr[b-np9quihycf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.soli-section-title[b-np9quihycf] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ba8b8;
}

.soli-divider[b-np9quihycf] {
    height: 1px;
    background: var(--soli-border);
    margin: 0 1.5rem;
    flex-shrink: 0;
}

/* ── Grid de dos columnas ──────────────────────────────────── */
.soli-grid-2[b-np9quihycf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 2rem;
    align-items: start;
}

.soli-col[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

/* ── Grid de Ruta (pares: OpCom|OpTipo / Origen|Destino / FechaI|FechaF / Carga|Notas) ── */
.soli-ruta-grid[b-np9quihycf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.9rem 2rem;
    align-items: start;
    margin-top: 0.75rem;
}

/* Elementos que ocupan todo el ancho (detalles de ubicación) */
.soli-ruta-span[b-np9quihycf] {
    grid-column: 1 / -1;
}

/* ── Valores con estilo tag/pill (lectura) ─────────────────── */
.soli-val--tag[b-np9quihycf] {
    display: inline-flex;
    align-items: center;
    background: #edf0ff;
    color: #3a4aee;
    border: 1.5px solid #c8d0ff;
    border-radius: 8px;
    padding: 0.4rem 1rem;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    max-width: fit-content;
    box-shadow: 0 1px 4px rgba(79,93,255,0.08);
}

.soli-val--tag-purple[b-np9quihycf] {
    background: #f3eeff;
    color: #6c35de;
    border-color: #cdb8f7;
    box-shadow: 0 1px 4px rgba(108,53,222,0.08);
}

.soli-val--tag-teal[b-np9quihycf] {
    background: #e6f8f2;
    color: #1e8a6e;
    border-color: #9fdece;
    box-shadow: 0 1px 4px rgba(30,138,110,0.08);
}

.soli-val--tag-slate[b-np9quihycf] {
    background: #f1f4f8;
    color: #3d5068;
    border-color: #cad3df;
    font-size: 0.85rem;
    letter-spacing: 0.02em;
    text-transform: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}


.soli-field[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

/* Proyecto + Sucursal lado a lado */
.soli-field-row[b-np9quihycf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

/* Labels */
.soli-lbl[b-np9quihycf] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--soli-label);
    letter-spacing: 0.03em;
}

/* Valores en modo lectura */
.soli-val[b-np9quihycf] {
    font-size: 0.9rem;
    color: var(--soli-val);
    padding: 0.2rem 0;
    min-height: 1.4rem;
}

.soli-val--bold[b-np9quihycf] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #1a2540;
}

/* Info row Cliente + RefALO */
.soli-info-row[b-np9quihycf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 2rem;
}

.soli-info-item[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

/* ── Campo con botón + al costado ──────────────────────────── */
.soli-input-with-btn[b-np9quihycf] {
    display: flex;
    gap: 6px;
    align-items: center;
}

    .soli-input-with-btn .rz-dropdown[b-np9quihycf] {
        flex: 1;
        min-width: 0;
    }

/* ── Acordeón de ubicación ─────────────────────────────────── */
.soli-ubi-details[b-np9quihycf] {
    background: #f8f9fb;
    border: 1px solid var(--soli-border);
    border-radius: var(--soli-radius);
    overflow: hidden;
    font-size: 0.8rem;
}

    .soli-ubi-details summary[b-np9quihycf] {
        padding: 0.45rem 0.85rem;
        cursor: pointer;
        font-weight: 600;
        color: var(--soli-accent);
        user-select: none;
        list-style: none;
    }

        .soli-ubi-details summary[b-np9quihycf]::before {
            content: "▶ ";
            font-size: 0.6rem;
        }

    .soli-ubi-details[open] summary[b-np9quihycf]::before {
        content: "▼ ";
    }

.soli-ubi-grid[b-np9quihycf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.1rem 0.5rem;
    padding: 0.5rem 0.85rem 0.75rem;
    margin: 0;
}

    .soli-ubi-grid > div[b-np9quihycf] {
        display: flex;
        gap: 0.3rem;
        align-items: baseline;
    }

    .soli-ubi-grid dt[b-np9quihycf] {
        font-weight: 600;
        color: var(--soli-label);
        white-space: nowrap;
        min-width: 4.5rem;
    }

    .soli-ubi-grid dd[b-np9quihycf] {
        margin: 0;
        color: var(--soli-val);
    }

/* ── Grid de mercancías ─────────────────────────────────────── */
.soli-grid-wrapper[b-np9quihycf] {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--soli-radius);
}

/* ── Tabs de mercancía ──────────────────────────────────────── */
.soli-tab-content[b-np9quihycf] {
    padding: 0.75rem 0;
}

.soli-empty-tab[b-np9quihycf],
.soli-dev-tab[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #9ba8b8;
    font-size: 0.85rem;
    text-align: center;
}

/* ── Footer ─────────────────────────────────────────────────── */
.soli-footer[b-np9quihycf] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.5rem 1.25rem;
    border-top: 1px solid var(--soli-border);
    flex-shrink: 0;
}

/* ── Radzen overrides ───────────────────────────────────────── */
.soli-modal .rz-dropdown[b-np9quihycf],
.soli-modal .rz-textbox[b-np9quihycf],
.soli-modal .rz-datepicker[b-np9quihycf],
.soli-modal textarea[b-np9quihycf] {
    border-radius: var(--soli-radius) !important;
}

.soli-modal .rz-datepicker[b-np9quihycf] {
    width: 100% !important;
}

.soli-modal textarea[b-np9quihycf] {
    min-height: 120px !important;
}

/* ── Compatibilidad con clases previas ──────────────────────── */
.form-ctl[b-np9quihycf] {
    width: 80%;
    margin-left: .5rem;
}

.form-row-2[b-np9quihycf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem 1rem;
}

.form-col-proyecto[b-np9quihycf],
.form-col-sucursal[b-np9quihycf] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* ── Pantalla grande: ≥ 1600px (22"+) ──────────────────────── */
@media (min-width: 1600px) {
    .soli-section[b-np9quihycf] {
        padding: 1.5rem 2rem;
    }

    .soli-grid-2[b-np9quihycf] {
        gap: 0 3rem;
    }

    .soli-col[b-np9quihycf] {
        gap: 1rem;
    }

    .soli-lbl[b-np9quihycf] {
        font-size: 0.75rem;
    }

    .soli-val[b-np9quihycf] {
        font-size: 0.95rem;
    }

    .soli-footer[b-np9quihycf] {
        padding: 1.25rem 2rem 1.5rem;
    }

    .soli-spinner-card[b-np9quihycf] {
        padding: 2.5rem 4rem;
    }
}

/* ── Escritorio estándar: 1025px – 1599px ───────────────────── */
/* (Estilos base ya cubren este rango — sin cambios) */

/* ── Tableta apaisada / laptop pequeño: 769px – 1024px ─────── */
@media (max-width: 1024px) {
    .soli-grid-2[b-np9quihycf] {
        gap: 0 1.25rem;
    }

    .soli-section[b-np9quihycf] {
        padding: 1rem 1.25rem;
    }

    .soli-field-row[b-np9quihycf] {
        grid-template-columns: 1fr 1fr; /* sigue en 2 cols */
    }
}

/* ── Tableta retrato: 641px – 768px ────────────────────────── */
@media (max-width: 768px) {

    /* Formulario: 1 columna */
    .soli-grid-2[b-np9quihycf] {
        grid-template-columns: 1fr;
        gap: 0;
    }

        /* Segunda columna aparece debajo, añadimos separación */
        .soli-grid-2 > .soli-col + .soli-col[b-np9quihycf] {
            margin-top: 0.85rem;
        }

    /* Ruta: 1 columna en móvil (el orden del DOM ya es el correcto) */
    .soli-ruta-grid[b-np9quihycf] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    /* Los spans siguen a ancho completo */
    .soli-ruta-span[b-np9quihycf] {
        grid-column: 1 / -1;
    }

    /* Proyecto + Sucursal: 1 columna en tableta */
    .soli-field-row[b-np9quihycf] {
        grid-template-columns: 1fr;
    }

    .soli-section[b-np9quihycf] {
        padding: 1rem;
    }

    .soli-divider[b-np9quihycf] {
        margin: 0 1rem;
    }

    .soli-footer[b-np9quihycf] {
        flex-direction: column-reverse;
        padding: 0.875rem 1rem;
        gap: 0.5rem;
    }

        .soli-footer .rz-button[b-np9quihycf] {
            width: 100%;
            justify-content: center;
        }

    /* Acordeón: columna única */
    .soli-ubi-grid[b-np9quihycf] {
        grid-template-columns: 1fr;
    }
}

/* ── Móvil: ≤ 480px ─────────────────────────────────────────── */
@media (max-width: 480px) {
    .soli-section[b-np9quihycf] {
        padding: 0.875rem 0.75rem;
    }

    .soli-divider[b-np9quihycf] {
        margin: 0 0.75rem;
    }

    .soli-section-title[b-np9quihycf] {
        font-size: 0.65rem;
    }

    .soli-lbl[b-np9quihycf] {
        font-size: 0.7rem;
    }

    .soli-val[b-np9quihycf] {
        font-size: 0.85rem;
    }

    .soli-footer[b-np9quihycf] {
        padding: 0.75rem;
    }

    .soli-spinner-card[b-np9quihycf] {
        padding: 1.5rem 1.75rem;
    }

    .soli-spinner-txt[b-np9quihycf] {
        font-size: 0.82rem;
    }

    /* En móvil ocultamos la col de Vol. m³ si se desea (opcional, comentar si no) */
    /* .rz-datatable-scrollable-wrapper { min-width: 600px; } */
}
/* /Pages/Logisticos/UltimaMilla/UltimaMillaPageRZ.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   UM PAGE — TEMA CORPORATIVO ALO / PANTONE
   Material 3 style, base clara, rojos suaves
   ═══════════════════════════════════════════════════════ */

.um-page[b-ymmoomnaui] {
  --bg: #f7f7f8;
  --white: #ffffff;
  --surface: #f3f4f6;
  --border: #ddd6cf;
  --border-strong: #c4b8aa;
  --text: #3a312b;
  --muted: #8b7d70;
  --primary: #d62828;
  --primary-hover: #b71c1c;
  --primary-active: #9f1616;
  --primary-soft: #fdecec;
  --primary-soft-2: #f8d7d8;
  --primary-soft-3: #fff1f1;
  --primary-border: #f1c6c7;
  --shadow: 0 2px 10px rgba(58, 49, 43, 0.08);
  --shadow-hover: 0 4px 18px rgba(214, 40, 40, 0.1);
  --shadow-button: 0 2px 8px rgba(214, 40, 40, 0.18);
  --r: 14px;
  background: var(--bg);
  padding: 0 0 2rem;
  min-height: 100%;
  color: var(--text);
}

/* ═══════════════════════════════════════════════════════
   TYPO / BASE
   ═══════════════════════════════════════════════════════ */

.um-breadcrumb[b-ymmoomnaui] {
  margin: 0.5rem 0 0.5rem;
}

.um-title[b-ymmoomnaui] {
  margin: 0 0 0.2rem;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1.2;
}

.um-subtitle[b-ymmoomnaui] {
  margin: 0 0 1rem;
  color: var(--muted);
  font-size: 0.95rem;
}

/* ═══════════════════════════════════════════════════════
   KPI
   ═══════════════════════════════════════════════════════ */

.um-kpis[b-ymmoomnaui] {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 0.85rem;
  margin-bottom: 1rem;
}

.um-kpi[b-ymmoomnaui] {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  min-height: 82px;
  overflow: hidden;
  transition:
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease;
}

.um-kpi:hover[b-ymmoomnaui] {
  box-shadow: var(--shadow-hover);
  border-color: var(--primary-border);
  transform: translateY(-1px);
}

.um-kpi-ico[b-ymmoomnaui] {
  width: 68px;
  min-width: 68px;
  height: 100%;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #fff6f6 0%, var(--primary-soft) 100%);
  color: var(--primary);
}

.um-kpi-ico[b-ymmoomnaui]  .rzi {
  font-size: 1.75rem !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
}

.um-kpi-body[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  padding: 0.75rem 1rem;
}

.um-kpi-lbl[b-ymmoomnaui] {
  font-size: 0.85rem;
  color: var(--muted);
  font-weight: 500;
}

.um-kpi-val[b-ymmoomnaui] {
  font-size: 1.85rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.1;
}

.um-kpi-suffix[b-ymmoomnaui] {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--muted);
}

/* ═══════════════════════════════════════════════════════
   TOOLBAR
   ═══════════════════════════════════════════════════════ */

.um-toolbar[b-ymmoomnaui] {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 0.7rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.um-toolbar-filters[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex: 1;
  min-width: 0;
  flex-wrap: wrap;
}

.um-search-box[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0 0.75rem;
  height: 40px;
  background: var(--white);
  flex: 2;
  min-width: 200px;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}

.um-search-box:focus-within[b-ymmoomnaui] {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(214, 40, 40, 0.1);
  background: #fffefe;
}

.um-search-box[b-ymmoomnaui]  input {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  height: 100% !important;
  padding: 0 !important;
  color: var(--text) !important;
}

.um-toolbar-actions[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.um-page[b-ymmoomnaui]  .um-upload .rz-button {
  height: 40px !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  border: 1px solid var(--border) !important;
  background: var(--white) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  transition: all 0.18s ease !important;
}

.um-page[b-ymmoomnaui]  .um-upload .rz-button:hover {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: var(--primary-soft) !important;
}

/* ═══════════════════════════════════════════════════════
   LOADER / EMPTY STATE
   ═══════════════════════════════════════════════════════ */

.um-loader-wrap[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: 2rem 0;
  color: var(--muted);
}

.um-state[b-ymmoomnaui] {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  min-height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 2rem;
}

.um-feed[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
}

/* ═══════════════════════════════════════════════════════
   CARD
   ═══════════════════════════════════════════════════════ */

.um-card[b-ymmoomnaui] {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 0.9rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-bottom: 0.7rem;
  transition:
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease;
}

.um-card:hover[b-ymmoomnaui] {
  box-shadow: var(--shadow-hover);
  border-color: var(--primary-border);
  transform: translateY(-1px);
}

/* ── TOP ROW ───────────────────────────────────────────── */

.um-card-top[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}

.um-transport-box[b-ymmoomnaui] {
  width: 38px;
  min-width: 38px;
  height: 38px;
  border-radius: 11px;
  background: linear-gradient(180deg, #fff6f6 0%, var(--primary-soft) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--primary);
}

.um-transport-box[b-ymmoomnaui]  .rzi {
  font-size: 1.2rem !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
}

.um-identity[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  flex: 1;
  min-width: 0;
}

.um-identity-row1[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.um-lbl[b-ymmoomnaui] {
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 500;
  white-space: nowrap;
}

.um-ref[b-ymmoomnaui] {
  font-size: 1rem;
  font-weight: 800;
  color: var(--text);
  white-space: nowrap;
}

.um-identity-row2[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  flex-wrap: wrap;
  font-size: 0.83rem;
  color: var(--muted);
}

.um-identity-row2[b-ymmoomnaui]  .rzi {
  font-size: 0.85rem !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
}

.um-tipo[b-ymmoomnaui] {
  color: var(--muted);
}

.um-sep[b-ymmoomnaui] {
  color: var(--border-strong);
  padding: 0 0.05rem;
}

.um-cliente[b-ymmoomnaui] {
  color: var(--text);
  font-weight: 600;
}

.um-top-right[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.38rem;
  margin-left: auto;
  flex-shrink: 0;
}

.um-inicio-lbl[b-ymmoomnaui] {
  font-size: 0.78rem;
  color: var(--muted);
  white-space: nowrap;
}

.um-quick-btns[b-ymmoomnaui] {
  display: flex;
  gap: 0.4rem;
}

.um-card-divider[b-ymmoomnaui] {
  height: 1px;
  background: var(--border);
}

/* ═══════════════════════════════════════════════════════
   CARD BOTTOM
   ═══════════════════════════════════════════════════════ */

.um-card-bottom[b-ymmoomnaui] {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  flex-wrap: nowrap;
}

.um-info-grid[b-ymmoomnaui] {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  flex: 1;
  min-width: 0;
}

.um-info-pair[b-ymmoomnaui] {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  flex-shrink: 0;
}

.um-info-item[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}

.um-info-grid .um-info-pair + .um-info-pair[b-ymmoomnaui] {
  padding-left: 1.25rem;
  border-left: 1px solid var(--border);
}

.um-route-arrows[b-ymmoomnaui] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.2rem;
  opacity: 0.55;
  flex-shrink: 0;
  padding-top: 0.25rem;
}

.um-route-arrows[b-ymmoomnaui]  .rzi {
  font-size: 1rem !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  color: #bbaea3;
}

.um-stop-lbl[b-ymmoomnaui] {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
}

.um-stop-val[b-ymmoomnaui] {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}

.um-card-actions[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
  margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   STATUS CHIPS
   ═══════════════════════════════════════════════════════ */

.um-chip[b-ymmoomnaui] {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.65rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  line-height: 1.5;
  border: 1px solid transparent;
}

.um-chip-abierto[b-ymmoomnaui] {
  background: var(--primary-soft);
  color: var(--primary-hover);
  border-color: var(--primary-border);
}

.um-chip-proceso[b-ymmoomnaui] {
  background: #f5ede5;
  color: #8b5e34;
  border-color: #e6d7c8;
}

.um-chip-terminado[b-ymmoomnaui] {
  background: #efe7df;
  color: #6f5c4c;
  border-color: #d9ccbe;
}

.um-chip-cancelado[b-ymmoomnaui] {
  background: var(--primary-soft-2);
  color: #8f1f24;
  border-color: #ebb1b4;
}

.um-chip-pendiente[b-ymmoomnaui] {
  background: #f1efec;
  color: #7d6f63;
  border-color: #ddd6cf;
}

.um-chip-solicitado[b-ymmoomnaui] {
  background: var(--primary-soft-3);
  color: var(--primary);
  border-color: #f5c2c3;
}

/* ═══════════════════════════════════════════════════════
   RADZEN OVERRIDES
   ═══════════════════════════════════════════════════════ */

/* Buttons */
.um-page[b-ymmoomnaui]  .rz-button,
.rz-button[b-ymmoomnaui] {
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all 0.18s ease !important;
}

/* Botón primario */
.um-page[b-ymmoomnaui]  .rz-button.rz-primary,
.rz-button.rz-primary[b-ymmoomnaui] {
  background: linear-gradient(
    135deg,
    var(--primary) 0%,
    #e63946 100%
  ) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: var(--shadow-button) !important;
}

.um-page[b-ymmoomnaui]  .rz-button.rz-primary:hover,
.rz-button.rz-primary:hover[b-ymmoomnaui] {
  background: linear-gradient(
    135deg,
    var(--primary-hover) 0%,
    var(--primary) 100%
  ) !important;
  box-shadow: 0 4px 12px rgba(214, 40, 40, 0.24) !important;
  transform: translateY(-1px);
}

.um-page[b-ymmoomnaui]  .rz-button.rz-primary:active,
.rz-button.rz-primary:active[b-ymmoomnaui] {
  background: var(--primary-active) !important;
  transform: scale(0.98);
}

/* Botón secundario */
.um-page[b-ymmoomnaui]  .rz-button.rz-secondary,
.rz-button.rz-secondary[b-ymmoomnaui] {
  background: #f3f4f6 !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}

.um-page[b-ymmoomnaui]  .rz-button.rz-secondary:hover,
.rz-button.rz-secondary:hover[b-ymmoomnaui] {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: var(--primary-soft) !important;
}

/* Outline */
.um-page[b-ymmoomnaui]  .rz-button.rz-outline-primary,
.rz-button.rz-outline-primary[b-ymmoomnaui] {
  background: transparent !important;
  border: 1px solid var(--primary) !important;
  color: var(--primary) !important;
}

.um-page[b-ymmoomnaui]  .rz-button.rz-outline-primary:hover,
.rz-button.rz-outline-primary:hover[b-ymmoomnaui] {
  background: var(--primary-soft) !important;
  border-color: var(--primary-hover) !important;
  color: var(--primary-hover) !important;
}

/* Inputs */
.um-page[b-ymmoomnaui]  .rz-textbox,
.um-page[b-ymmoomnaui]  .rz-dropdown,
.um-page[b-ymmoomnaui]  .rz-datepicker,
.um-page[b-ymmoomnaui]  .rz-numeric,
.rz-textbox[b-ymmoomnaui],
.rz-dropdown[b-ymmoomnaui],
.rz-datepicker[b-ymmoomnaui],
.rz-numeric[b-ymmoomnaui] {
  border-radius: 10px !important;
  border-color: var(--border) !important;
  background: var(--white) !important;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease !important;
}

.um-page[b-ymmoomnaui]  .rz-textbox:focus,
.um-page[b-ymmoomnaui]  .rz-dropdown:focus,
.um-page[b-ymmoomnaui]  .rz-datepicker:focus,
.um-page[b-ymmoomnaui]  .rz-numeric:focus,
.rz-textbox:focus[b-ymmoomnaui],
.rz-dropdown:focus[b-ymmoomnaui],
.rz-datepicker:focus[b-ymmoomnaui],
.rz-numeric:focus[b-ymmoomnaui] {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(214, 40, 40, 0.1) !important;
  outline: none !important;
}

/* Panels / cards */
.um-page[b-ymmoomnaui]  .rz-panel,
.um-page[b-ymmoomnaui]  .rz-card,
.rz-panel[b-ymmoomnaui],
.rz-card[b-ymmoomnaui] {
  border-radius: 14px !important;
  border-color: var(--border) !important;
  box-shadow: var(--shadow) !important;
}

/* Tabs */
.um-page[b-ymmoomnaui]  .rz-tabview-nav li a,
.rz-tabview-nav li a[b-ymmoomnaui] {
  border-radius: 10px 10px 0 0 !important;
}

.um-page[b-ymmoomnaui]  .rz-tabview-selected a,
.rz-tabview-selected a[b-ymmoomnaui] {
  color: var(--primary) !important;
  border-color: var(--primary) !important;
}

/* DataGrid */
.um-page[b-ymmoomnaui]  .rz-datatable,
.um-page[b-ymmoomnaui]  .rz-data-grid,
.rz-datatable[b-ymmoomnaui],
.rz-data-grid[b-ymmoomnaui] {
  border-radius: 14px !important;
  overflow: hidden;
  border-color: var(--border) !important;
}

.um-page[b-ymmoomnaui]  .rz-datatable-thead th,
.um-page[b-ymmoomnaui]  .rz-data-grid-data thead th,
.rz-datatable-thead th[b-ymmoomnaui],
.rz-data-grid-data thead th[b-ymmoomnaui] {
  background: #faf7f7 !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  font-weight: 700 !important;
}

.um-page[b-ymmoomnaui]  .rz-datatable-data tr:hover,
.um-page[b-ymmoomnaui]  .rz-data-grid-data tr:hover,
.rz-datatable-data tr:hover[b-ymmoomnaui],
.rz-data-grid-data tr:hover[b-ymmoomnaui] {
  background: #fffafa !important;
}

/* Dialog */
.um-page[b-ymmoomnaui]  .rz-dialog,
.rz-dialog[b-ymmoomnaui] {
  border-radius: 16px !important;
  overflow: hidden;
}

.um-page[b-ymmoomnaui]  .rz-dialog-titlebar,
.rz-dialog-titlebar[b-ymmoomnaui] {
  background: linear-gradient(
    90deg,
    #fff8f8 0%,
    var(--primary-soft) 100%
  ) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--primary-border) !important;
}

/* Badges / notifications */
.um-page[b-ymmoomnaui]  .rz-badge,
.rz-badge[b-ymmoomnaui] {
  border-radius: 999px !important;
}

.um-page[b-ymmoomnaui]  .rz-state-highlight,
.rz-state-highlight[b-ymmoomnaui] {
  background: var(--primary-soft) !important;
  color: var(--primary-hover) !important;
}

/* Checkbox / radio / switches */
.um-page[b-ymmoomnaui]  .rz-chkbox-box.rz-state-active,
.um-page[b-ymmoomnaui]  .rz-radiobutton-box.rz-state-active,
.rz-chkbox-box.rz-state-active[b-ymmoomnaui],
.rz-radiobutton-box.rz-state-active[b-ymmoomnaui] {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
}

.um-page[b-ymmoomnaui]  .rz-switch-checked .rz-switch-circle,
.rz-switch-checked .rz-switch-circle[b-ymmoomnaui] {
  background: var(--primary) !important;
}

/* Links */
.um-page a[b-ymmoomnaui],
.rz-link[b-ymmoomnaui] {
  color: var(--primary);
  transition: color 0.18s ease;
}

.um-page a:hover[b-ymmoomnaui],
.rz-link:hover[b-ymmoomnaui] {
  color: var(--primary-hover);
}

/* ═══════════════════════════════════════════════════════
   SCROLL / INFINITE
   ═══════════════════════════════════════════════════════ */

.um-scroll-sentinel[b-ymmoomnaui] {
  height: 1px;
  margin-top: 0.5rem;
}

.um-loader-more[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 1rem 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.um-end-label[b-ymmoomnaui] {
  text-align: center;
  padding: 1rem 0 0.5rem;
  font-size: 0.82rem;
  color: var(--muted);
  letter-spacing: 0.03em;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */

@media (max-width: 1280px) {
  .um-kpis[b-ymmoomnaui] {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 960px) {
  .um-toolbar[b-ymmoomnaui] {
    flex-direction: column;
    align-items: stretch;
  }

  .um-toolbar-filters[b-ymmoomnaui] {
    flex-direction: column;
  }

  .um-toolbar-actions[b-ymmoomnaui] {
    justify-content: flex-start;
  }

  .um-search-box[b-ymmoomnaui] {
    min-width: 0;
    flex: 1;
  }
}

@media (max-width: 768px) {
  .um-card-top[b-ymmoomnaui] {
    flex-wrap: wrap;
    gap: 0.6rem;
  }

  .um-top-right[b-ymmoomnaui] {
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: 0;
    order: 3;
  }

  .um-card-bottom[b-ymmoomnaui] {
    flex-direction: column;
    gap: 0.75rem;
  }

  .um-route-arrows[b-ymmoomnaui] {
    display: none;
  }

  .um-info-grid[b-ymmoomnaui] {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }

  .um-info-pair[b-ymmoomnaui] {
    flex-direction: column;
    gap: 0.55rem;
    padding-left: 0 !important;
    border-left: none !important;
  }

  .um-info-grid .um-info-pair:last-child[b-ymmoomnaui] {
    padding-left: 0.75rem !important;
    border-left: 1px solid var(--border) !important;
  }

  .um-card-actions[b-ymmoomnaui] {
    width: 100%;
    margin-left: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
  }

  .um-card-actions[b-ymmoomnaui]  .rz-button {
    width: 100% !important;
    justify-content: center !important;
  }

  .um-card-actions[b-ymmoomnaui]  .rz-button:last-child {
    grid-column: 1 / -1;
  }

  .um-stop-val[b-ymmoomnaui] {
    max-width: 100%;
    white-space: normal;
  }

  .um-quick-btns[b-ymmoomnaui] {
    gap: 0.45rem;
  }

  .um-quick-btns[b-ymmoomnaui]  .rz-button {
    flex: 1;
  }

  .um-kpis[b-ymmoomnaui] {
    grid-template-columns: repeat(2, 1fr);
  }

  .um-pager[b-ymmoomnaui] {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .um-page[b-ymmoomnaui] {
    padding: 0 0 1.5rem;
  }

  .um-title[b-ymmoomnaui] {
    font-size: 1.4rem;
  }

  .um-card[b-ymmoomnaui] {
    padding: 0.8rem 0.85rem;
  }

  .um-kpis[b-ymmoomnaui] {
    grid-template-columns: 1fr;
  }

  .um-ref[b-ymmoomnaui] {
    white-space: normal;
    word-break: break-all;
  }

  .um-info-grid[b-ymmoomnaui] {
    gap: 0.5rem;
  }

  .um-card-actions[b-ymmoomnaui]  .rz-button:last-child {
    grid-column: 1 / -1;
    height: 36px !important;
  }
}
/* ── Refs ALO + Cliente lado a lado con divisor ─── */
.um-refs-pair[b-ymmoomnaui] {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}

.um-refs-pair .um-identity-row1 + .um-identity-row1[b-ymmoomnaui] {
  padding-left: 1.25rem;
  border-left: 1px solid var(--border);
}
/* /Pages/Logisticos/UltimaMilla/UltimaMillaTimeLineAgregarTraking.razor.rz.scp.css */
/* ============================================================
   AGREGAR / EDITAR EVENTUALIDAD  |  ev-* design system
   Estilo corporativo moderno, consistente con ct-*
   ============================================================ */

/* ── Wrapper ────────────────────────────────────────────────── */
.ev-modal[b-wadyt407l9] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: #f4f6fb;
    overflow: hidden;
    font-family: inherit;
}

/* ════════════════════════════════════════════════════════════
   HEADER
   ════════════════════════════════════════════════════════════ */
.ev-header[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.9rem 1.25rem;
    background: #fff;
    border-bottom: 2px solid #e2e6f0;
    flex-shrink: 0;
}

.ev-header-icon[b-wadyt407l9] {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: linear-gradient(135deg, #ff7171, #e84040);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 12px rgba(232,64,64,.30);
    flex-shrink: 0;
}

    .ev-header-icon .material-icons[b-wadyt407l9] {
        font-size: 1.3rem;
        color: #fff;
    }

.ev-header-info[b-wadyt407l9] {
    flex: 1;
    min-width: 0;
}

.ev-header-title[b-wadyt407l9] {
    font-size: 1rem;
    font-weight: 800;
    color: #1a2540;
    line-height: 1.2;
}

.ev-header-sub[b-wadyt407l9] {
    font-size: 0.75rem;
    color: #7b8a9b;
    font-weight: 500;
    margin-top: 0.15rem;
    display: flex;
    align-items: center;
    gap: 0.2rem;
    flex-wrap: wrap;
}

.ev-header-sep[b-wadyt407l9] {
    opacity: 0.4;
    margin: 0 0.2rem;
}

.ev-saving-badge[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: #edf0ff;
    border: 1px solid #c3caff;
    color: #4f5dff;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.28rem 0.75rem;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
    animation: ev-fade-in-b-wadyt407l9 0.2s ease;
}

@keyframes ev-fade-in-b-wadyt407l9 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ════════════════════════════════════════════════════════════
   BODY
   ════════════════════════════════════════════════════════════ */
.ev-body[b-wadyt407l9] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0; /* RadzenTemplateForm lleva el gap internamente */
}

    .ev-body[b-wadyt407l9]::-webkit-scrollbar {
        width: 5px;
    }

    .ev-body[b-wadyt407l9]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

    .ev-body[b-wadyt407l9]::-webkit-scrollbar-track {
        background: transparent;
    }

    /* El formulario dentro del body ocupa todo */
    .ev-body > form[b-wadyt407l9],
    .ev-body .rz-form[b-wadyt407l9] {
        display: flex;
        flex-direction: column;
        gap: 0.875rem;
        flex: 1;
    }

/* ════════════════════════════════════════════════════════════
   CAMPOS
   ════════════════════════════════════════════════════════════ */
.ev-row-2[b-wadyt407l9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.ev-field[b-wadyt407l9] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.ev-lbl[b-wadyt407l9] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #7b8a9b;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 0.28rem;
}

.ev-icon[b-wadyt407l9] {
    font-size: 0.82rem !important;
    color: #b0bac9;
}

.ev-req[b-wadyt407l9] {
    color: #e84040;
    font-size: 0.8rem;
    line-height: 1;
    font-style: normal;
}

/* ════════════════════════════════════════════════════════════
   SECCIÓN EVIDENCIAS
   ════════════════════════════════════════════════════════════ */
.ev-evidence-box[b-wadyt407l9] {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    /* overflow:hidden eliminado — bloqueaba position:sticky en los encabezados de la tabla */
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 6px rgba(26,37,64,.05);
}

.ev-evidence-hdr[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    background: #fafbfd;
    border-bottom: 1px solid #e2e6f0;
    flex-wrap: nowrap; /* no wrap: todo en una sola línea */
    justify-content: space-between;
}

.ev-evidence-title[b-wadyt407l9] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #9ba8b8;
}

.ev-evidence-hint[b-wadyt407l9] {
    font-size: 0.66rem;
    color: #b0bac9;
    margin-right: auto;
}

/* ── RadzenUpload — solo mostrar el botón, ocultar TODO lo demás ─ */

/* 1) El wrapper ev-rz-upload: inline-flex para no ocupar todo el ancho */
.ev-rz-upload[b-wadyt407l9] {
    display: inline-flex !important;
}

    /* 2) El rz-fileupload: altura fija = solo el botón, overflow hidden */
    .ev-rz-upload .rz-fileupload[b-wadyt407l9] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
        max-height: 34px !important; /* ← corta todo lo que Radzen renderice debajo */
        overflow: hidden !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .ev-rz-upload .rz-fileupload-buttonbar[b-wadyt407l9] {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .ev-rz-upload .rz-button.rz-fileupload-choose[b-wadyt407l9] {
        height: 30px !important;
        padding: 0 0.875rem !important;
        border-radius: 6px !important;
        font-size: 0.73rem !important;
        font-weight: 700 !important;
        background: #4f5dff !important;
        border: none !important;
        color: #fff !important;
        box-shadow: 0 2px 8px rgba(79,93,255,.28) !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 0.3rem !important;
        cursor: pointer !important;
        transition: background .15s !important;
        white-space: nowrap !important;
    }

        .ev-rz-upload .rz-button.rz-fileupload-choose:hover[b-wadyt407l9] {
            background: #3245e0 !important;
        }

    /* ══ OCULTAR COMPLETAMENTE la lista de archivos nativa de Radzen ══
   Capas de seguridad: clases conocidas + regla universal sobre todo
   lo que no sea el buttonbar ni el choose-button. */
    .ev-rz-upload .rz-fileupload-content[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-files[b-wadyt407l9],
    .ev-rz-upload .rz-messages[b-wadyt407l9],
    .ev-rz-upload .rz-g[b-wadyt407l9],
    .ev-rz-upload table[b-wadyt407l9],
    .ev-rz-upload .p-fileupload-content[b-wadyt407l9],
    .ev-rz-upload .p-messages[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-file[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-row[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-filename[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-size[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload > *:not(.rz-fileupload-buttonbar)[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-buttonbar > *:not(.rz-button)[b-wadyt407l9],
    .ev-rz-upload .rz-fileupload-buttonbar > *:not(.rz-button.rz-fileupload-choose)[b-wadyt407l9] {
        display: none !important;
        height: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: hidden !important;
    }

/* ── Scroll wrapper — position:relative para que sticky funcione ─ */
.ev-files-scroll[b-wadyt407l9] {
    max-height: 200px;
    overflow-y: auto;
    min-height: 0;
    position: relative; /* ancla para position:sticky dentro */
}

    .ev-files-scroll[b-wadyt407l9]::-webkit-scrollbar {
        width: 4px;
    }

    .ev-files-scroll[b-wadyt407l9]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

/* ── Tabla de archivos pendientes ───────────────────────────── */
.ev-files-table[b-wadyt407l9] {
    width: 100%;
    border-collapse: separate; /* ← collapse rompe sticky en Chrome/Safari */
    border-spacing: 0; /* visualmente igual que collapse */
    font-size: 0.8rem;
}

    .ev-files-table thead tr[b-wadyt407l9] {
        background: #23304d;
    }

    .ev-files-table thead th[b-wadyt407l9] {
        color: #fff;
        font-size: 0.67rem;
        font-weight: 700;
        letter-spacing: 0.07em;
        text-transform: uppercase;
        padding: 0.45rem 0.75rem;
        text-align: left;
        white-space: nowrap;
        position: sticky;
        top: 0;
        z-index: 2;
    }

    .ev-files-table tbody tr[b-wadyt407l9] {
        border-bottom: 1px solid #f0f2f7;
        transition: background 0.12s;
    }

        .ev-files-table tbody tr:hover[b-wadyt407l9] {
            background: #f6f7fc;
        }

    .ev-files-table tbody td[b-wadyt407l9] {
        padding: 0.5rem 0.75rem;
        vertical-align: middle;
    }

.ev-file-row[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.ev-file-icon[b-wadyt407l9] {
    font-size: 1.15rem !important;
    color: #7b8a9b;
    flex-shrink: 0;
}

.ev-file-name[b-wadyt407l9] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #23304d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.ev-file-size[b-wadyt407l9] {
    font-size: 0.64rem;
    color: #9ba8b8;
}

.ev-rm-btn[b-wadyt407l9] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: #fff0f0;
    color: #e84040;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.14s;
    flex-shrink: 0;
    padding: 0;
}

    .ev-rm-btn:hover:not(:disabled)[b-wadyt407l9] {
        background: #ffd4d4;
    }

    .ev-rm-btn:disabled[b-wadyt407l9] {
        opacity: 0.5;
        cursor: default;
    }

/* Estado vacío — compacto para no desperdiciar espacio */
.ev-files-empty[b-wadyt407l9] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    color: #b0bac9;
    font-size: 0.75rem;
    font-style: italic;
    text-align: center;
}

/* Botón subir evidencias en modo Editar */
.ev-upload-action[b-wadyt407l9] {
    display: flex;
    justify-content: flex-end;
    padding: 0.5rem 0.875rem;
    border-top: 1px solid #f0f2f7;
    background: #fafbfd;
}

/* ════════════════════════════════════════════════════════════
   SECCIÓN EVIDENCIAS GUARDADAS (modo Editar)
   ════════════════════════════════════════════════════════════ */
.ev-saved-box[b-wadyt407l9] {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(26,37,64,.05);
    display: flex;
    flex-direction: column;
}

.ev-saved-hdr[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    background: #fafbfd;
    border-bottom: 1px solid #e2e6f0;
}

.ev-badge[b-wadyt407l9] {
    background: #18b977;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    letter-spacing: 0.03em;
}

/* ════════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════════ */
.ev-footer[b-wadyt407l9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    background: #fff;
    border-top: 1px solid #e2e6f0;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.ev-footer-err[b-wadyt407l9] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #e84040;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ev-footer-btns[b-wadyt407l9] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
    margin-left: auto;
}

/* ════════════════════════════════════════════════════════════
   BOTONES
   ════════════════════════════════════════════════════════════ */
.ev-btn[b-wadyt407l9] {
    height: 38px;
    padding: 0 1.1rem;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: background 0.15s, box-shadow 0.15s, opacity 0.15s;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
    font-family: inherit;
}

/* Cerrar — outline neutro */
.ev-btn--cancel[b-wadyt407l9] {
    background: #fff;
    border: 1.5px solid #d0d6e6;
    color: #555f70;
}

    .ev-btn--cancel:hover:not(:disabled)[b-wadyt407l9] {
        border-color: #4f5dff;
        color: #4f5dff;
    }

    .ev-btn--cancel:disabled[b-wadyt407l9] {
        opacity: 0.5;
        cursor: default;
    }

/* Crear / Actualizar — azul sólido */
.ev-btn--save[b-wadyt407l9] {
    background: #4f5dff;
    color: #fff;
    box-shadow: 0 3px 10px rgba(79,93,255,.32);
    min-width: 110px;
    justify-content: center;
}

    .ev-btn--save:hover:not(:disabled)[b-wadyt407l9] {
        background: #3245e0;
        box-shadow: 0 4px 14px rgba(79,93,255,.42);
    }

    .ev-btn--save:disabled[b-wadyt407l9] {
        background: #a5acff;
        box-shadow: none;
        cursor: default;
    }

/* Editar — outline info */
.ev-btn--edit[b-wadyt407l9] {
    background: #fff;
    border: 1.5px solid #4f5dff;
    color: #4f5dff;
}

    .ev-btn--edit:hover:not(:disabled)[b-wadyt407l9] {
        background: #edf0ff;
    }

/* Subir evidencias — verde outline */
.ev-btn--upload[b-wadyt407l9] {
    height: 32px;
    background: #fff;
    border: 1.5px solid #18b977;
    color: #18b977;
    font-size: 0.75rem;
    padding: 0 0.875rem;
    border-radius: 7px;
}

    .ev-btn--upload:hover:not(:disabled)[b-wadyt407l9] {
        background: #e8faf2;
    }

    .ev-btn--upload:disabled[b-wadyt407l9] {
        opacity: 0.5;
        cursor: default;
    }

/* ════════════════════════════════════════════════════════════
   RADZEN GRID — override de estilos internos
   ════════════════════════════════════════════════════════════ */
.ev-modal .rz-grid-table thead th[b-wadyt407l9] {
    background: #23304d !important;
    color: #fff !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 5 !important;
}

.ev-modal .rz-grid-table tbody td[b-wadyt407l9] {
    font-size: 0.78rem !important;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* Tablet — 768px */
@media (max-width: 768px) {
    .ev-row-2[b-wadyt407l9] {
        grid-template-columns: 1fr;
        gap: 0.625rem;
    }

    .ev-evidence-hdr[b-wadyt407l9] {
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .ev-evidence-hint[b-wadyt407l9] {
        flex: 0 0 100%;
        order: 3;
        font-size: 0.63rem;
    }

    .ev-files-scroll[b-wadyt407l9] {
        max-height: 170px;
    }

    .ev-files-table tbody td[b-wadyt407l9] {
        padding: 0.4rem 0.5rem;
    }

    .ev-file-name[b-wadyt407l9] {
        max-width: 140px;
    }
}

/* Móvil grande — 640px */
@media (max-width: 640px) {
    .ev-header[b-wadyt407l9] {
        padding: 0.65rem 0.875rem;
        gap: 0.625rem;
    }

    .ev-header-icon[b-wadyt407l9] {
        width: 36px;
        height: 36px;
        border-radius: 8px;
    }

    .ev-header-title[b-wadyt407l9] {
        font-size: 0.9rem;
    }

    .ev-header-sub[b-wadyt407l9] {
        font-size: 0.7rem;
    }

    .ev-body[b-wadyt407l9] {
        padding: 0.75rem;
        gap: 0;
    }

        .ev-body > form[b-wadyt407l9], .ev-body .rz-form[b-wadyt407l9] {
            gap: 0.65rem;
        }

    .ev-row-2[b-wadyt407l9] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    .ev-evidence-hdr[b-wadyt407l9] {
        flex-wrap: wrap;
        gap: 0.35rem;
        padding: 0.5rem 0.75rem;
    }

    .ev-evidence-hint[b-wadyt407l9] {
        display: none;
    }

    .ev-rz-upload .rz-button.rz-fileupload-choose[b-wadyt407l9] {
        width: 100% !important;
        justify-content: center !important;
    }

    .ev-files-scroll[b-wadyt407l9] {
        max-height: 150px;
    }

    /* En móvil colapsar la tabla a 2 columnas: Tipo y Quitar, Archivo en fila propia */
    .ev-files-table thead th:nth-child(2)[b-wadyt407l9] {
        display: none;
    }

    .ev-files-table tbody td:nth-child(2)[b-wadyt407l9] {
        display: none;
    }

    .ev-footer[b-wadyt407l9] {
        padding: 0.625rem 0.875rem;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .ev-footer-btns[b-wadyt407l9] {
        width: 100%;
        justify-content: stretch;
        gap: 0.4rem;
    }

    .ev-btn[b-wadyt407l9] {
        flex: 1;
        justify-content: center;
        font-size: 0.78rem;
    }

    .ev-footer-err[b-wadyt407l9] {
        display: none;
    }
}

/* Móvil pequeño — 420px */
@media (max-width: 420px) {
    .ev-header-icon[b-wadyt407l9] {
        display: none;
    }

    .ev-header-title[b-wadyt407l9] {
        font-size: 0.85rem;
    }

    .ev-body[b-wadyt407l9] {
        padding: 0.625rem;
    }

    .ev-footer[b-wadyt407l9] {
        padding: 0.5rem 0.625rem;
    }
}
/* /Pages/Logisticos/UltimaMilla/UltimaMillaTimeLineControlPageRZ.razor.rz.scp.css */
/* ============================================================
   TORRE DE CONTROL — Mission Control Aesthetic  |  v4 layout
   ============================================================ */

:root[b-qmvxnfhjz2] {
    --ct-bg: #f4f6fb;
    --ct-border: #e2e6f0;
    --ct-navy: #1a2540;
    --ct-label: #7b8a9b;
    --ct-val: #23304d;
    --ct-accent: #4f5dff;
    --ct-green: #18b977;
    --ct-green-bg: #e8faf2;
    --ct-green-bdr: #9de8c3;
    --ct-red: #e84040;
    --ct-red-bg: #fff0f0;
    --ct-red-bdr: #f7bcbc;
    --ct-radius: 10px;
    --ct-shadow: 0 2px 12px rgba(26,37,64,.07);
}

.display-zoom[b-qmvxnfhjz2] {
    zoom: 0.8;
}

/* ── Modal ─────────────────────────────────────────────────── */
.ct-modal[b-qmvxnfhjz2] {
    display: flex;
    flex-direction: column;
    background: #f4f6fb;
    min-height: 0;
    height: 100%;
    overflow: hidden; /* desktop: el grid interno maneja el espacio */
}

/* ══════════════════════════════════════════════════════════
   NUEVO LAYOUT — 3 columnas con grid-areas
   Columna 1: izquierda (Transportes + Registro)
   Columna 2: centro (Mapa)
   Columna 3: Timeline (toda la altura)
   Fila inferior: Documentos (col 1 + col 2)
   ══════════════════════════════════════════════════════════ */
.ct-layout[b-qmvxnfhjz2] {
    display: grid;
    grid-template-columns: 320px 1fr 280px;
    grid-template-rows: auto auto;
    grid-template-areas:
        "left center timeline"
        "docs  docs   timeline";
    gap: 0.875rem;
    padding: 0.875rem;
    flex: 1;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

/* ════════════════════════════════════════════════════════════
   PANEL IZQUIERDO — col 1, filas 1
   ════════════════════════════════════════════════════════════ */
.ct-left-panel[b-qmvxnfhjz2] {
    grid-area: left;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    min-height: 0;
    padding-right: 2px;
    /* Sin align-self:start → el panel ocupa la altura de la fila (auto),
       que queda fijada por su propio contenido. El mapa (col 2) se estira
       para igualar esa misma altura de fila. */
}

    .ct-left-panel[b-qmvxnfhjz2]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-left-panel[b-qmvxnfhjz2]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

/* ════════════════════════════════════════════════════════════
   PANEL CENTRAL — col 2, fila 1
   align-self: stretch (default) → ocupa toda la altura de la fila,
   que viene determinada por el contenido del panel izquierdo.
   El mapa (flex:1 dentro) se expande para llenar lo que queda tras la action-bar.
   ════════════════════════════════════════════════════════════ */
.ct-center-panel[b-qmvxnfhjz2] {
    grid-area: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE — col 3, filas 1+2 (toda la altura)
   ════════════════════════════════════════════════════════════ */
.ct-tl-outer[b-qmvxnfhjz2] {
    grid-area: timeline;
    display: flex;
    flex-direction: column;
    background: #fafbfd;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    min-height: 0;
    overflow: hidden;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS — cols 1+2, fila 2 (abajo)
   max-height reducida: muestra 2-3 filas + scroll
   ════════════════════════════════════════════════════════════ */
.ct-docs-section[b-qmvxnfhjz2] {
    grid-area: docs;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 195px; /* ≈ header + 3 filas de tabla */
    align-self: start; /* no estira: deja espacio visible entre Registro y Docs */
}

/* Contenedor scrolleable para la grid de archivos guardados */
.ct-docs-scroll-wrap[b-qmvxnfhjz2] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

    .ct-docs-scroll-wrap[b-qmvxnfhjz2]::-webkit-scrollbar {
        width: 5px;
    }

    .ct-docs-scroll-wrap[b-qmvxnfhjz2]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

    .ct-docs-scroll-wrap[b-qmvxnfhjz2]::-webkit-scrollbar-track {
        background: #f4f6fb;
    }

/* Prompt: sin transporte seleccionado */
.ct-select-prompt[b-qmvxnfhjz2] {
    grid-column: 2 / 4;
    grid-row: 1 / 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.875rem;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    padding: 2rem;
    text-align: center;
}

/* ════════════════════════════════════════════════════════════
   SECCIÓN GENÉRICA
   ════════════════════════════════════════════════════════════ */
.ct-section[b-qmvxnfhjz2] {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    overflow: hidden;
}

.ct-section-hdr[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fafbfd;
    flex-shrink: 0;
}

.ct-section-title[b-qmvxnfhjz2] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ba8b8;
    flex: 1;
}

.ct-section-body[b-qmvxnfhjz2] {
    padding: 0.875rem 1rem;
}

/* ── Transport list ─────────────────────────────────────────── */
.ct-transport-list[b-qmvxnfhjz2] {
    /* altura fija ≈ 2.5 cards → scroll para el resto */
    height: 195px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.625rem;
}

.ct-transport-list--slots[b-qmvxnfhjz2] {
    background-image: linear-gradient(rgba(79,93,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(79,93,255,.06) 1px, transparent 1px);
    background-size: 18px 18px;
    background-color: #f6f7fc;
    border-radius: 0 0 10px 10px;
    min-height: 130px;
}

.ct-transport-list[b-qmvxnfhjz2]::-webkit-scrollbar {
    width: 4px;
}

.ct-transport-list[b-qmvxnfhjz2]::-webkit-scrollbar-thumb {
    background: #c8d0e0;
    border-radius: 4px;
}

.ct-transport-empty[b-qmvxnfhjz2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1.5rem;
    color: #9ba8b8;
    font-size: 0.8rem;
    font-style: italic;
    width: 100%;
}

/* ── Transport card ─────────────────────────────────────────── */
.ct-transport-card[b-qmvxnfhjz2] {
    background: #fff;
    border: 1.5px solid #e2e6f0;
    border-radius: 8px;
    padding: 0.55rem 0.875rem; /* más compacto */
    cursor: pointer;
    transition: all 0.18s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(26,37,64,.06);
}

    .ct-transport-card[b-qmvxnfhjz2]::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: transparent;
        transition: background 0.18s ease;
        border-radius: 3px 0 0 3px;
    }

    .ct-transport-card:hover[b-qmvxnfhjz2] {
        border-color: #c3caff;
        box-shadow: 0 2px 10px rgba(79,93,255,.12);
        transform: translateX(2px);
    }

.ct-transport-card--active[b-qmvxnfhjz2] {
    border-color: #4f5dff;
    background: #f5f6ff;
    box-shadow: 0 2px 12px rgba(79,93,255,.14);
}

    .ct-transport-card--active[b-qmvxnfhjz2]::before {
        background: #4f5dff;
    }

/* S1 — Placas + Tipo chip + Estado badge en la misma fila */
.ct-card-row1[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.28rem;
}

.ct-card-row1-right[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.ct-card-plates[b-qmvxnfhjz2] {
    font-size: 0.92rem;
    font-weight: 800;
    color: #1a2540;
    letter-spacing: 0.03em;
    line-height: 1.2;
}

/* S2 — Conductor */
.ct-card-driver[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    font-size: 0.74rem;
    font-weight: 600;
    color: #555f70;
    margin-bottom: 0.28rem;
}

.ct-card-driver-icon[b-qmvxnfhjz2] {
    font-size: 0.8rem !important;
    color: #9ba8b8;
    flex-shrink: 0;
}

/* S3 — Referencia ALO (izq) + Ver detalle (der) en misma línea */
.ct-card-row3[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
}

.ct-card-meta[b-qmvxnfhjz2] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin-bottom: 0.35rem;
}

.ct-meta-chip[b-qmvxnfhjz2] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #7b8a9b;
    background: #f1f4f8;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ct-card-ref[b-qmvxnfhjz2] {
    font-size: 0.73rem;
    font-weight: 600;
    color: #4f5dff;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ct-btn-tracking[b-qmvxnfhjz2] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.68rem;
    font-weight: 700;
    color: #4f5dff;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .ct-btn-tracking:hover[b-qmvxnfhjz2] {
        color: #3245e0;
    }

/* ── Status badges ──────────────────────────────────────────── */
.ct-status[b-qmvxnfhjz2] {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.6rem;
    border-radius: 20px;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ct-status-1[b-qmvxnfhjz2] {
    background: #1a2540;
    color: #fff;
}

.ct-status-2[b-qmvxnfhjz2] {
    background: #fff3cd;
    color: #92600a;
    border: 1px solid #fcd34d;
}

.ct-status-3[b-qmvxnfhjz2] {
    background: #e8faf2;
    color: #0f7a50;
    border: 1px solid #9de8c3;
}

.ct-status-4[b-qmvxnfhjz2] {
    background: #fff0f0;
    color: #e84040;
    border: 1px solid #f7bcbc;
}

.ct-status-5[b-qmvxnfhjz2] {
    background: #f1f4f8;
    color: #555f70;
    border: 1px solid #d0d6e0;
}

.ct-status-7[b-qmvxnfhjz2] {
    background: #edf0ff;
    color: #4f5dff;
    border: 1px solid #c3caff;
}

.ct-status-10[b-qmvxnfhjz2] {
    background: #fff0e0;
    color: #b45309;
    border: 1px solid #fcd49a;
}

/* ── Form fields ────────────────────────────────────────────── */
.ct-field[b-qmvxnfhjz2] {
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
    margin-bottom: 0.7rem;
}

.ct-lbl[b-qmvxnfhjz2] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #7b8a9b;
    letter-spacing: 0.03em;
}

.ct-field-row[b-qmvxnfhjz2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.ct-upload-label[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}

/* ══════════════════════════════════════════════════════════
   BOTONES — colores hardcodeados (Blazor scoped CSS no
   resuelve :root vars de forma confiable)
   ══════════════════════════════════════════════════════════ */
.ct-actions[b-qmvxnfhjz2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.ct-btn[b-qmvxnfhjz2] {
    height: 34px;
    padding: 0 0.875rem;
    border-radius: 7px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

.ct-btn--primary[b-qmvxnfhjz2] {
    background: #4f5dff;
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,93,255,.32);
}

    .ct-btn--primary:hover:not(:disabled)[b-qmvxnfhjz2] {
        background: #3245e0;
        box-shadow: 0 3px 12px rgba(79,93,255,.42);
    }

    .ct-btn--primary:disabled[b-qmvxnfhjz2] {
        background: #a5acff;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--outline[b-qmvxnfhjz2] {
    background: #fff;
    border: 1.5px solid #c8d0e0;
    color: #23304d;
}

    .ct-btn--outline:hover:not(:disabled)[b-qmvxnfhjz2] {
        border-color: #4f5dff;
        color: #4f5dff;
    }

    .ct-btn--outline:disabled[b-qmvxnfhjz2] {
        opacity: 0.5;
        cursor: default;
    }

.ct-btn--danger[b-qmvxnfhjz2] {
    background: #e84040;
    color: #fff;
    box-shadow: 0 2px 8px rgba(232,64,64,.30);
}

    .ct-btn--danger:hover:not(:disabled)[b-qmvxnfhjz2] {
        background: #c42f2f;
    }

    .ct-btn--danger:disabled[b-qmvxnfhjz2] {
        background: #f4a0a0;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--fin[b-qmvxnfhjz2] {
    background: #23304d;
    color: #fff;
    box-shadow: 0 2px 8px rgba(35,48,77,.26);
}

    .ct-btn--fin:hover:not(:disabled)[b-qmvxnfhjz2] {
        background: #1a2540;
    }

    .ct-btn--fin:disabled[b-qmvxnfhjz2] {
        background: #7b8a9b;
        box-shadow: none;
        cursor: default;
    }

.ct-divider[b-qmvxnfhjz2] {
    height: 1px;
    background: #e2e6f0;
    margin: 0.75rem 0;
}

/* ══════════════════════════════════════════════════════════
   RADZEN UPLOAD & SPLITBUTTON
   ══════════════════════════════════════════════════════════ */
.ct-rz-upload .rz-fileupload[b-qmvxnfhjz2],
.ct-rz-upload .rz-fileupload-buttonbar[b-qmvxnfhjz2] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.ct-rz-upload .rz-button.rz-fileupload-choose[b-qmvxnfhjz2] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
}

    .ct-rz-upload .rz-button.rz-fileupload-choose:hover[b-qmvxnfhjz2] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

.ct-rz-upload--action .rz-button.rz-fileupload-choose[b-qmvxnfhjz2] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #4f5dff !important;
    color: #4f5dff !important;
    box-shadow: 0 2px 8px rgba(79,93,255,.14) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: background .15s, color .15s !important;
}

    .ct-rz-upload--action .rz-button.rz-fileupload-choose:hover[b-qmvxnfhjz2] {
        background: #4f5dff !important;
        color: #fff !important;
    }

/* ── Botón compacto "Documento" con ícono clip (panel izquierdo) */
.ct-rz-upload--doc .rz-button.rz-fileupload-choose[b-qmvxnfhjz2] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #fff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
    width: auto !important;
}

    .ct-rz-upload--doc .rz-button.rz-fileupload-choose:hover[b-qmvxnfhjz2] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

/* Ocultar lista nativa Radzen en el botón doc */
.ct-rz-upload--doc .rz-fileupload-content[b-qmvxnfhjz2],
.ct-rz-upload--doc .rz-fileupload-files[b-qmvxnfhjz2],
.ct-rz-upload--doc .rz-messages[b-qmvxnfhjz2],
.ct-rz-upload--doc .rz-g[b-qmvxnfhjz2],
.ct-rz-upload--doc table[b-qmvxnfhjz2],
.ct-rz-upload--doc .rz-fileupload > *:not(.rz-fileupload-buttonbar)[b-qmvxnfhjz2] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton)[b-qmvxnfhjz2] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px 0 0 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #23304d !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(35,48,77,.26) !important;
    transition: background .15s !important;
}

    .ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton):hover[b-qmvxnfhjz2] {
        background: #1a2540 !important;
    }

.ct-rz-splitbtn .rz-button.rz-splitbutton-menubutton[b-qmvxnfhjz2] {
    height: 36px !important;
    width: 32px !important;
    border-radius: 0 7px 7px 0 !important;
    background: #1a2540 !important;
    border: none !important;
    border-left: 1px solid rgba(255,255,255,.18) !important;
    color: #fff !important;
}

/* ════════════════════════════════════════════════════════════
   ACTION BAR
   ════════════════════════════════════════════════════════════ */
.ct-action-bar[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════
   MAPA — ocupa todo el alto de la fila 1 (igual que panel izq)
   ════════════════════════════════════════════════════════════ */
.ct-map-wrap[b-qmvxnfhjz2] {
    position: relative;
    /* flex:1 eliminado — el ct-center-panel es flex-column y el mapa debe
       llenar toda la altura disponible de la fila del grid, que es igual
       a la altura total del panel izquierdo (Transportes + Registro tiempos) */
    flex: 1;
    min-height: 0;
    background: #eef0f7;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
}

#map[b-qmvxnfhjz2] {
    height: 100%;
    width: 100%;
    min-height: 300px;
}

.ct-map-placeholder[b-qmvxnfhjz2] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(248,249,253,.93);
    backdrop-filter: blur(2px);
    gap: 0.6rem;
    color: #9ba8b8;
    z-index: 500;
    pointer-events: none;
}

.ct-map-placeholder-icon[b-qmvxnfhjz2] {
    font-size: 2.8rem;
    opacity: 0.28;
    color: #4f5dff;
}

.ct-map-placeholder-txt[b-qmvxnfhjz2] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #7b8a9b;
}

.ct-map-placeholder-hint[b-qmvxnfhjz2] {
    font-size: 0.73rem;
    color: #b0bac9;
    max-width: 220px;
    text-align: center;
    line-height: 1.4;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE
   ════════════════════════════════════════════════════════════ */
.ct-tl-hdr[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.875rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fff;
    flex-shrink: 0;
    border-radius: 10px 10px 0 0;
}

.ct-tl-hdr-title[b-qmvxnfhjz2] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #9ba8b8;
    flex: 1;
}

.ct-tl-legend[b-qmvxnfhjz2] {
    display: flex;
    gap: 0.75rem;
}

.ct-tl-legend-item[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.62rem;
    font-weight: 600;
    color: #7b8a9b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ct-tl-legend-dot[b-qmvxnfhjz2] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.ct-tl-legend-dot--ctrl[b-qmvxnfhjz2] {
    background: #18b977;
}

.ct-tl-legend-dot--incident[b-qmvxnfhjz2] {
    background: #e84040;
}

.ct-tl-scroll[b-qmvxnfhjz2] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.625rem;
}

    .ct-tl-scroll[b-qmvxnfhjz2]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-tl-scroll[b-qmvxnfhjz2]::-webkit-scrollbar-thumb {
        background: #d0d6e0;
        border-radius: 4px;
    }

.ct-tl-empty[b-qmvxnfhjz2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.5rem;
    color: #b0bac9;
    font-size: 0.82rem;
    text-align: center;
    padding: 1.5rem;
}

.ct-tl-list[b-qmvxnfhjz2] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: 14px;
}

    .ct-tl-list[b-qmvxnfhjz2]::before {
        content: '';
        position: absolute;
        left: 14px;
        top: 16px;
        bottom: 16px;
        width: 2px;
        background: linear-gradient(to bottom, #18b977 0%, #c3caff 50%, #e84040 100%);
        opacity: 0.3;
        border-radius: 2px;
    }

.ct-tl-item[b-qmvxnfhjz2] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.35rem 0.35rem 0.35rem 0;
    cursor: pointer;
    border-radius: 7px;
    transition: background 0.15s ease;
    margin-bottom: 2px;
}

    .ct-tl-item:hover[b-qmvxnfhjz2] {
        background: rgba(79,93,255,.045);
    }

.ct-tl-dot[b-qmvxnfhjz2] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    transition: transform 0.15s ease;
}

.ct-tl-item:hover .ct-tl-dot[b-qmvxnfhjz2] {
    transform: scale(1.12);
}

.ct-tl-dot--ctrl[b-qmvxnfhjz2] {
    background: linear-gradient(135deg, #2dd473, #18b977);
    border: 2px solid #fff;
}

.ct-tl-dot--incident[b-qmvxnfhjz2] {
    background: linear-gradient(135deg, #ff6b6b, #e84040);
    border: 2px solid #fff;
}

.ct-tl-dot-icon[b-qmvxnfhjz2] {
    font-size: 0.85rem;
    color: #fff;
}

.ct-tl-dot--pulse[b-qmvxnfhjz2]::after {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 2px solid currentColor;
    opacity: 0;
    animation: ct-pulse-b-qmvxnfhjz2 2s infinite;
}

.ct-tl-dot--ctrl.ct-tl-dot--pulse[b-qmvxnfhjz2] {
    color: #18b977;
}

.ct-tl-dot--incident.ct-tl-dot--pulse[b-qmvxnfhjz2] {
    color: #e84040;
}

@keyframes ct-pulse-b-qmvxnfhjz2 {
    0% {
        transform: scale(1);
        opacity: 0.7;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

.ct-tl-card[b-qmvxnfhjz2] {
    flex: 1;
    min-width: 0;
    padding: 0.4rem 0.55rem;
    border-radius: 7px;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.ct-tl-item--ctrl .ct-tl-card[b-qmvxnfhjz2] {
    background: #e8faf2;
    border-color: #9de8c3;
}

.ct-tl-item--ctrl:hover .ct-tl-card[b-qmvxnfhjz2] {
    background: #d1f7e5;
    border-color: #18b977;
}

.ct-tl-item--incident .ct-tl-card[b-qmvxnfhjz2] {
    background: #fff0f0;
    border-color: #f7bcbc;
}

.ct-tl-item--incident:hover .ct-tl-card[b-qmvxnfhjz2] {
    background: #ffdede;
    border-color: #e84040;
}

.ct-tl-card-title[b-qmvxnfhjz2] {
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.3;
    word-break: break-word;
}

.ct-tl-item--ctrl .ct-tl-card-title[b-qmvxnfhjz2] {
    color: #0a6b41;
}

.ct-tl-item--incident .ct-tl-card-title[b-qmvxnfhjz2] {
    color: #b02020;
}

.ct-tl-card-date[b-qmvxnfhjz2] {
    font-size: 0.65rem;
    color: #7b8a9b;
    margin-top: 0.12rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS PENDIENTES
   ════════════════════════════════════════════════════════════ */
.ct-docs-pending[b-qmvxnfhjz2] {
    padding: 0.75rem 1rem;
    border-top: 1px solid #e2e6f0;
}

.ct-docs-pending-title[b-qmvxnfhjz2] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #7b8a9b;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

.ct-empty-state[b-qmvxnfhjz2] {
    padding: 1rem;
    text-align: center;
    color: #9ba8b8;
    font-size: 0.82rem;
    font-style: italic;
}

.ct-select-prompt-icon[b-qmvxnfhjz2] {
    font-size: 3rem;
    color: #c3caff;
}

.ct-select-prompt-title[b-qmvxnfhjz2] {
    font-size: 1rem;
    font-weight: 700;
    color: #23304d;
}

.ct-select-prompt-sub[b-qmvxnfhjz2] {
    font-size: 0.82rem;
    color: #7b8a9b;
    max-width: 280px;
}

.ct-badge[b-qmvxnfhjz2] {
    background: #4f5dff;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    letter-spacing: 0.03em;
}

.ct-loading[b-qmvxnfhjz2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    color: #7b8a9b;
    font-size: 0.82rem;
}

/* ── Radzen grid overrides ──────────────────────────────────── */
.ct-modal .rz-grid-table thead th[b-qmvxnfhjz2] {
    background: #23304d !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
}

.ct-modal .rz-grid-table tbody td[b-qmvxnfhjz2] {
    font-size: 0.78rem !important;
}

/* ── Leaflet ─────────────────────────────────────────────────── */
.leaflet-popup-content-wrapper[b-qmvxnfhjz2],
.leaflet-popup-tip[b-qmvxnfhjz2] {
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,.15);
}

/* ── SweetAlert ─────────────────────────────────────────────── */
.swal-scroll-content[b-qmvxnfhjz2] {
    max-height: 50vh;
    overflow-y: auto;
    text-align: left;
    padding-right: 10px;
}

.swal2-popup[b-qmvxnfhjz2] {
    max-height: 90vh;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* 1280px — laptop 13" */
@media (max-width: 1280px) {
    .ct-layout[b-qmvxnfhjz2] {
        grid-template-columns: 280px 1fr 260px;
    }
}

/* 1024px — tablet landscape */
@media (max-width: 1024px) {
    .ct-layout[b-qmvxnfhjz2] {
        grid-template-columns: 240px 1fr 220px;
        gap: 0.625rem;
        padding: 0.625rem;
    }

    .ct-tl-card-title[b-qmvxnfhjz2] {
        font-size: 0.7rem;
    }

    .ct-docs-section[b-qmvxnfhjz2] {
        max-height: 185px;
    }
}

/* ════════════════════════════════════════════════════════════
   860px — TABLET PORTRAIT + MÓVIL GRANDE
   Columna única. Orden visual:
   1) Transportes activos
   2) Registro de tiempos (Hito + Fecha + botones)
   3) Action bar (Cargar Tracking / Exportar)
   4) Mapa
   5) Timeline
   6) Documentos
   ════════════════════════════════════════════════════════════ */
@media (max-width: 860px) {

    /* ── El modal ya no tiene altura fija: todo scrollea ── */
    .ct-modal[b-qmvxnfhjz2] {
        overflow-y: auto;
        height: auto;
        min-height: 100%; /* ocupa el dialog pero puede crecer */
    }

    /* ── Layout: columna única, altura automática ── */
    .ct-layout[b-qmvxnfhjz2] {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        padding: 0.75rem;
        height: auto;
        min-height: 0;
        overflow: visible; /* deja que el modal externo scrollee */
    }

    /* ── Reorden explícito de secciones con order ── */
    .ct-left-panel[b-qmvxnfhjz2] {
        order: 1;
        overflow: visible;
    }

    .ct-center-panel[b-qmvxnfhjz2] {
        order: 2;
    }

    .ct-tl-outer[b-qmvxnfhjz2] {
        order: 3;
    }

    .ct-docs-section[b-qmvxnfhjz2] {
        order: 4;
    }

    /* ── Transport list: altura auto (muestra todas las cards) ── */
    .ct-transport-list[b-qmvxnfhjz2] {
        height: auto;
        max-height: 300px; /* scroll solo si hay muchas placas */
    }

    /* ── Registro de tiempos: 2 columnas (Hito + Fecha en la misma fila) ── */
    .ct-field-row[b-qmvxnfhjz2] {
        grid-template-columns: 1fr 1fr;
    }

    /* ── Botones de acción: 2 por fila, wrappeable ── */
    .ct-actions[b-qmvxnfhjz2] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .ct-actions .ct-btn[b-qmvxnfhjz2] {
            flex: 1 1 calc(50% - 0.25rem);
            min-width: 110px;
            justify-content: center;
        }

        /* Botón documento ocupa fila completa */
        .ct-actions .ct-rz-upload--doc[b-qmvxnfhjz2] {
            flex: 1 1 100%;
        }

            .ct-actions .ct-rz-upload--doc .rz-button.rz-fileupload-choose[b-qmvxnfhjz2] {
                width: 100% !important;
                justify-content: center !important;
            }

    /* ── Action bar: wrap ── */
    .ct-action-bar[b-qmvxnfhjz2] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    /* ── Mapa ── */
    .ct-map-wrap[b-qmvxnfhjz2] {
        min-height: 280px;
    }

    #map[b-qmvxnfhjz2] {
        min-height: 280px;
    }

    .ct-center-panel[b-qmvxnfhjz2] {
        min-height: 0;
    }

    /* ── Timeline: banda compacta ── */
    .ct-tl-outer[b-qmvxnfhjz2] {
        max-height: 320px;
        border-radius: 10px;
    }

    /* ── Documentos ── */
    .ct-docs-section[b-qmvxnfhjz2] {
        max-height: 220px;
        align-self: auto;
    }

    .ct-select-prompt[b-qmvxnfhjz2] {
        grid-column: 1;
        grid-row: auto;
    }
}

/* ════════════════════════════════════════════════════════════
   600px — MÓVIL ESTÁNDAR (iPhone 14, Pixel, etc.)
   ════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

    .ct-modal[b-qmvxnfhjz2] {
        background: #fff;
    }

    .ct-layout[b-qmvxnfhjz2] {
        padding: 0.5rem;
        gap: 0.625rem;
    }

    /* ── Cards de transporte más compactas ── */
    .ct-card-plates[b-qmvxnfhjz2] {
        font-size: 0.8rem;
    }

    .ct-meta-chip[b-qmvxnfhjz2] {
        font-size: 0.58rem;
        padding: 0.07rem 0.3rem;
    }

    .ct-status[b-qmvxnfhjz2] {
        font-size: 0.58rem;
        padding: 0.1rem 0.4rem;
    }

    .ct-card-driver[b-qmvxnfhjz2] {
        font-size: 0.75rem;
    }

    .ct-transport-card[b-qmvxnfhjz2] {
        padding: 0.5rem 0.625rem;
    }

    /* ── Registro de tiempos: 1 columna ── */
    .ct-field-row[b-qmvxnfhjz2] {
        grid-template-columns: 1fr;
    }

    /* ── Botones: grid 2 columnas ── */
    .ct-actions[b-qmvxnfhjz2] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.4rem;
    }

        .ct-actions .ct-btn[b-qmvxnfhjz2] {
            width: 100%;
            justify-content: center;
            font-size: 0.73rem;
            padding: 0 0.5rem;
        }
        /* Documento: fila completa */
        .ct-actions .ct-rz-upload--doc[b-qmvxnfhjz2] {
            grid-column: 1 / -1;
        }

            .ct-actions .ct-rz-upload--doc .rz-button.rz-fileupload-choose[b-qmvxnfhjz2] {
                width: 100% !important;
                justify-content: center !important;
                font-size: 0.73rem !important;
            }

    /* ── Action bar ── */
    .ct-action-bar[b-qmvxnfhjz2] {
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    /* ── Mapa ── */
    .ct-map-wrap[b-qmvxnfhjz2] {
        min-height: 240px;
    }

    #map[b-qmvxnfhjz2] {
        min-height: 240px;
    }

    /* ── Timeline ── */
    .ct-tl-outer[b-qmvxnfhjz2] {
        max-height: 280px;
    }

    .ct-tl-legend[b-qmvxnfhjz2] {
        gap: 0.35rem;
    }

    .ct-tl-legend-item[b-qmvxnfhjz2] {
        font-size: 0.6rem;
    }

    /* ── Documentos: ocultar col Fecha para que Tipo+Nombre quepan ── */
    .ct-docs-section[b-qmvxnfhjz2] {
        max-height: 200px;
    }

        .ct-docs-section .rz-grid-table thead th:nth-child(3)[b-qmvxnfhjz2],
        .ct-docs-section .rz-grid-table tbody td:nth-child(3)[b-qmvxnfhjz2] {
            display: none !important;
        }

    /* ── Secciones: paddings reducidos ── */
    .ct-section-hdr[b-qmvxnfhjz2] {
        padding: 0.5rem 0.75rem;
    }

    .ct-section-body[b-qmvxnfhjz2] {
        padding: 0.625rem 0.75rem;
    }

    .ct-lbl[b-qmvxnfhjz2] {
        font-size: 0.65rem;
    }
}

/* ════════════════════════════════════════════════════════════
   430px — MÓVIL PEQUEÑO (iPhone SE, Galaxy A)
   ════════════════════════════════════════════════════════════ */
@media (max-width: 430px) {

    .ct-layout[b-qmvxnfhjz2] {
        padding: 0.375rem;
        gap: 0.5rem;
    }

    /* Una sola columna para botones */
    .ct-actions[b-qmvxnfhjz2] {
        grid-template-columns: 1fr;
    }

        .ct-actions .ct-rz-upload--doc[b-qmvxnfhjz2] {
            grid-column: 1;
        }

    .ct-btn[b-qmvxnfhjz2] {
        height: 32px;
        font-size: 0.7rem;
    }

    .ct-map-wrap[b-qmvxnfhjz2] {
        min-height: 200px;
    }

    #map[b-qmvxnfhjz2] {
        min-height: 200px;
    }

    .ct-tl-outer[b-qmvxnfhjz2] {
        max-height: 240px;
    }

    /* En 430px ocultar también col acciones de docs (ver/del via swipe) */
    .ct-docs-section .rz-grid-table thead th:nth-child(4)[b-qmvxnfhjz2],
    .ct-docs-section .rz-grid-table tbody td:nth-child(4)[b-qmvxnfhjz2] {
        display: none !important;
    }
}
/* /Pages/Logisticos/UltimaMilla/UltimaMillaTranPageRZ.razor.rz.scp.css */
/* ============================================================
   SOLICITUD DE SERVICIO A TRANSPORTISTA — Modal Styles
   Consistent with soli-* design system
   ============================================================ */

/* ── Variables (heredadas del sistema) ─────────────────────── */
:root[b-wiwc3dhkch] {
    --tran-border: #e2e6f0;
    --tran-label: #7b8a9b;
    --tran-val: #23304d;
    --tran-accent: #4f5dff;
    --tran-radius: 8px;
    --tran-origin: #edf3ff;
    --tran-dest: #f0faf5;
}

/* ── Contenedor principal ──────────────────────────────────── */
.tran-modal[b-wiwc3dhkch] {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 12px;
    overflow: hidden; /* sin scroll en el modal */
    min-height: 0;
}

/* ── Secciones ─────────────────────────────────────────────── */
.tran-section[b-wiwc3dhkch] {
    padding: 1rem 1.5rem;
    flex-shrink: 0;
}

.tran-section-hdr[b-wiwc3dhkch] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.tran-section-title[b-wiwc3dhkch] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ba8b8;
    flex: 1;
}

.tran-badge[b-wiwc3dhkch] {
    background: #edf0ff;
    color: #4f5dff;
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 20px;
    padding: 0.1rem 0.55rem;
    border: 1px solid #d5daff;
}

.tran-divider[b-wiwc3dhkch] {
    height: 1px;
    background: var(--tran-border);
    margin: 0 1.5rem;
    flex-shrink: 0;
}

/* ── Grid de 2 cols (Sección 1) ────────────────────────────── */
.tran-grid-2[b-wiwc3dhkch] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 2rem;
}

/* ── Campos ────────────────────────────────────────────────── */
.tran-field[b-wiwc3dhkch] {
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
}

.tran-lbl[b-wiwc3dhkch] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--tran-label);
    letter-spacing: 0.03em;
}

/* ── Grid de Ruta (Origen → flecha → Destino) ──────────────── */
.tran-route-grid[b-wiwc3dhkch] {
    display: grid;
    grid-template-columns: 1fr 36px 1fr;
    gap: 0 0.75rem;
    align-items: start;
}

.tran-route-arrow[b-wiwc3dhkch] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 2.8rem;
    gap: 0.25rem;
    color: #c0c9dc;
}

.tran-arrow-line[b-wiwc3dhkch] {
    width: 1px;
    flex: 1;
    min-height: 24px;
    background: #e2e6f0;
}

/* ── Tarjetas de ubicación ─────────────────────────────────── */
.tran-location-card[b-wiwc3dhkch] {
    border: 1.5px solid var(--tran-border);
    border-radius: 10px;
    overflow: hidden;
}

.tran-location-card--origin[b-wiwc3dhkch] {
    border-top: 3px solid #4f86ff;
}

.tran-location-card--dest[b-wiwc3dhkch] {
    border-top: 3px solid #59be9a;
}

.tran-location-header[b-wiwc3dhkch] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.6rem 0.85rem;
    background: #f8f9fb;
    border-bottom: 1px solid var(--tran-border);
    gap: 0.5rem;
    flex-wrap: wrap;
}

.tran-location-badge[b-wiwc3dhkch] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 20px;
    padding: 0.2rem 0.65rem;
}

.tran-location-badge--origin[b-wiwc3dhkch] {
    background: #edf3ff;
    color: #4f86ff;
    border: 1px solid #c8d8ff;
}

.tran-location-badge--dest[b-wiwc3dhkch] {
    background: #ebf8f1;
    color: #2a9d7f;
    border: 1px solid #b8e8d4;
}

.tran-location-date[b-wiwc3dhkch] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    color: #7b8a9b;
    font-weight: 500;
}

.tran-location-name[b-wiwc3dhkch] {
    padding: 0.55rem 0.85rem 0.35rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--tran-val);
    border-bottom: 1px solid #f0f2f7;
}

.tran-location-details[b-wiwc3dhkch] {
    padding: 0.5rem 0.85rem 0.65rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.tran-loc-row[b-wiwc3dhkch] {
    display: flex;
    gap: 0.4rem;
    font-size: 0.78rem;
    line-height: 1.4;
}

.tran-loc-key[b-wiwc3dhkch] {
    font-weight: 600;
    color: var(--tran-label);
    min-width: 5rem;
    flex-shrink: 0;
}

.tran-loc-val[b-wiwc3dhkch] {
    color: var(--tran-val);
}

.tran-loc-row--ref .tran-loc-val[b-wiwc3dhkch] {
    color: #4f5dff;
    font-size: 0.74rem;
}

/* ── Tabla de mercancías con scroll ────────────────────────── */
.tran-grid-scroll[b-wiwc3dhkch] {
    max-height: 190px;
    overflow-y: auto;
    border-radius: var(--tran-radius);
    border: 1px solid var(--tran-border);
}

    .tran-grid-scroll[b-wiwc3dhkch]::-webkit-scrollbar {
        width: 5px;
    }

    .tran-grid-scroll[b-wiwc3dhkch]::-webkit-scrollbar-track {
        background: #f1f4f8;
    }

    .tran-grid-scroll[b-wiwc3dhkch]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

/* ── Transport grid (form fields) ──────────────────────────── */
.tran-transport-grid[b-wiwc3dhkch] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem 1.5rem;
    align-items: start;
}

.tran-field--wide[b-wiwc3dhkch] {
    grid-column: span 2;
}

/* ── Documentos ─────────────────────────────────────────────── */
.tran-docs-row[b-wiwc3dhkch] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-top: 0.85rem;
    flex-wrap: wrap;
}

.tran-docs-list[b-wiwc3dhkch] {
    flex: 1;
    min-width: 200px;
}

.tran-docs-saved[b-wiwc3dhkch] {
    margin-top: 0.75rem;
}

.tran-loading[b-wiwc3dhkch] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    color: #7b8a9b;
    font-size: 0.85rem;
}

.tran-empty-docs[b-wiwc3dhkch] {
    font-size: 0.82rem;
    color: #9ba8b8;
    font-style: italic;
    padding: 0.5rem 0;
    margin: 0;
}

/* ── Footer ─────────────────────────────────────────────────── */
.tran-footer[b-wiwc3dhkch] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem 1rem;
    border-top: 1px solid var(--tran-border);
    background: #fafbfd;
    flex-shrink: 0;
}

/* ── Radzen overrides ───────────────────────────────────────── */
.tran-modal .rz-dropdown[b-wiwc3dhkch],
.tran-modal .rz-textbox[b-wiwc3dhkch],
.tran-modal .rz-autocomplete[b-wiwc3dhkch] {
    border-radius: var(--tran-radius) !important;
}

/* Grid header theme (mantiene el estilo anterior de la tabla) */
.tran-modal .rz-grid-table thead th[b-wiwc3dhkch] {
    background: #23304d !important;
    color: #fff !important;
}

/* ── Zoom para pantallas pequeñas ──────────────────────────── */
.display-zoom[b-wiwc3dhkch] {
    zoom: 0.82;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* ── Laptop pequeño: ≤ 1280px ──────────────────────────────── */
@media (max-width: 1280px) {
    .tran-transport-grid[b-wiwc3dhkch] {
        grid-template-columns: repeat(3, 1fr);
    }

    .tran-field--wide[b-wiwc3dhkch] {
        grid-column: span 2;
    }
}

/* ── Tableta apaisada: ≤ 1024px ────────────────────────────── */
@media (max-width: 1024px) {
    .tran-route-grid[b-wiwc3dhkch] {
        grid-template-columns: 1fr 28px 1fr;
    }

    .tran-transport-grid[b-wiwc3dhkch] {
        grid-template-columns: repeat(2, 1fr);
    }

    .tran-field--wide[b-wiwc3dhkch] {
        grid-column: span 2;
    }
}

/* ── Tableta retrato: ≤ 768px ──────────────────────────────── */
@media (max-width: 768px) {
    .tran-section[b-wiwc3dhkch] {
        padding: 0.875rem 1rem;
    }

    .tran-divider[b-wiwc3dhkch] {
        margin: 0 1rem;
    }

    /* Ruta en una sola columna */
    .tran-route-grid[b-wiwc3dhkch] {
        grid-template-columns: 1fr;
    }

    .tran-route-arrow[b-wiwc3dhkch] {
        flex-direction: row;
        padding-top: 0;
        padding: 0.5rem 0;
        justify-content: center;
    }

    .tran-arrow-line[b-wiwc3dhkch] {
        width: 24px;
        min-height: 1px;
        height: 1px;
    }

    /* Asignación: 2 cols */
    .tran-grid-2[b-wiwc3dhkch] {
        grid-template-columns: 1fr;
    }

    .tran-transport-grid[b-wiwc3dhkch] {
        grid-template-columns: 1fr 1fr;
    }

    .tran-footer[b-wiwc3dhkch] {
        flex-direction: column-reverse;
        padding: 0.875rem 1rem;
    }

        .tran-footer .rz-button[b-wiwc3dhkch] {
            width: 100%;
            justify-content: center;
        }
}

/* ── Móvil: ≤ 480px ─────────────────────────────────────────── */
@media (max-width: 480px) {
    .tran-transport-grid[b-wiwc3dhkch] {
        grid-template-columns: 1fr;
    }

    .tran-field--wide[b-wiwc3dhkch] {
        grid-column: span 1;
    }

    .tran-section[b-wiwc3dhkch] {
        padding: 0.75rem;
    }

    .tran-loc-key[b-wiwc3dhkch] {
        min-width: 4rem;
    }
}

/* ── Spinner overlay (igual que soli-modal) ─────────────────── */
.tran-spinner-overlay[b-wiwc3dhkch] {
    position: absolute;
    inset: 0;
    z-index: 200;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.tran-spinner-card[b-wiwc3dhkch] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid var(--tran-border);
    border-radius: 16px;
    padding: 2rem 3rem;
    box-shadow: 0 8px 32px rgba(79, 93, 255, 0.12);
}

.tran-spinner-txt[b-wiwc3dhkch] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--tran-accent);
    letter-spacing: 0.02em;
}
/* /Pages/Monitor de Logs/MonitorLogsPage.razor.rz.scp.css */
.monitor-logs-page[b-c0zaibnugy] {
    --ml-bg: #f5f6f8;
    --ml-card: #ffffff;
    --ml-border: #dfe4ec;
    --ml-text: #20283a;
    --ml-muted: #6f7890;
    --ml-danger: #cf2436;
    --ml-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);

    padding: 18px 24px;
    background: var(--ml-bg);
    min-height: 100vh;
}

.ml-breadcrumb[b-c0zaibnugy] {
    margin-bottom: 6px;
}

.ml-header h1[b-c0zaibnugy] {
    margin: 0;
    font-size: 28px;
    font-weight: 900;
    color: var(--ml-text);
}

.ml-header p[b-c0zaibnugy] {
    margin: 4px 0 18px;
    color: var(--ml-muted);
    font-size: 15px;
}

.ml-card[b-c0zaibnugy] {
    background: var(--ml-card);
    border: 1px solid var(--ml-border);
    border-radius: 14px;
    box-shadow: var(--ml-shadow);
}

.ml-filters-card[b-c0zaibnugy] {
    padding: 16px 18px;
    margin-bottom: 16px;
}

.ml-grid-card[b-c0zaibnugy] {
    overflow: hidden;
}

.ml-grid-header[b-c0zaibnugy] {
    padding: 16px 18px 12px;
    border-bottom: 1px solid #e5e9f0;
}

.ml-card-title[b-c0zaibnugy] {
    font-size: 17px;
    font-weight: 900;
    color: var(--ml-text);
}

.ml-card-subtitle[b-c0zaibnugy] {
    margin-top: 4px;
    font-size: 13px;
    color: var(--ml-muted);
}

.ml-filter-actions[b-c0zaibnugy] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.ml-state[b-c0zaibnugy] {
    padding: 26px 18px;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    color: var(--ml-muted);
    border-bottom: 1px solid #eef2f7;
}

.ml-state-compact[b-c0zaibnugy] {
    padding: 16px 12px;
    border: 1px dashed var(--ml-border);
    border-radius: 12px;
    margin-top: 10px;
}

.ml-state-text[b-c0zaibnugy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ml-grid[b-c0zaibnugy] {
    width: 100%;
}

.ml-mono[b-c0zaibnugy] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
}

.ml-error-text[b-c0zaibnugy] {
    color: #263044;
    overflow-wrap: break-word;
    word-break: break-word;
}

.ml-datos-ingresados[b-c0zaibnugy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 12px;
    line-height: 1.25;
    color: #263044;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Cuando el detalle se renderiza dentro del RowExpandTemplate del grid
   (inline debajo de la fila), Radzen crea una celda que ocupa todo el ancho.
   El padding propio de esa celda ya da espacio, así que usamos margen mínimo. */
.ml-detalle-wrap[b-c0zaibnugy] {
    margin: 4px 0 4px;
    padding: 16px 18px;
    border: 1px solid var(--ml-border);
    border-left: 4px solid var(--ml-danger);
    border-radius: 12px;
    background: #f9fafb;
}

.ml-detalle-header[b-c0zaibnugy] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

.ml-detalle-title[b-c0zaibnugy] {
    font-weight: 900;
    color: var(--ml-text);
    font-size: 16px;
}

.ml-detalle-subtitle[b-c0zaibnugy] {
    margin-top: 4px;
    color: var(--ml-muted);
    font-size: 13px;
}

.ml-detalle-grid[b-c0zaibnugy] {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.ml-detalle-field label[b-c0zaibnugy] {
    display: block;
    font-size: 11px;
    font-weight: 900;
    color: var(--ml-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.ml-detalle-field span[b-c0zaibnugy] {
    display: block;
    margin-top: 4px;
    color: var(--ml-text);
    font-size: 13px;
    font-weight: 650;
    overflow-wrap: break-word;
    word-break: break-word;
}

.ml-alert[b-c0zaibnugy] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 10px;
    background: #fff2f3;
    border: 1px solid #f0b8bf;
    color: #a6192e;
    font-size: 13px;
}

.ml-alert-title[b-c0zaibnugy] {
    font-weight: 900;
    margin-bottom: 6px;
}

.ml-alert-item[b-c0zaibnugy] {
    overflow-wrap: break-word;
    word-break: break-word;
}

.ml-block[b-c0zaibnugy] {
    background: #ffffff;
    border: 1px solid var(--ml-border);
    border-radius: 12px;
    padding: 12px 12px;
}

.ml-block-title[b-c0zaibnugy] {
    font-weight: 900;
    color: var(--ml-text);
    font-size: 13px;
    margin-bottom: 10px;
}

.ml-muted[b-c0zaibnugy] {
    color: var(--ml-muted);
}

.ml-kv[b-c0zaibnugy] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: #263044;
    overflow-wrap: break-word;
    word-break: break-word;
}

.ml-code[b-c0zaibnugy] {
    background: #f5f6f8;
    border: 1px solid var(--ml-border);
    border-radius: 10px;
    padding: 10px;
    font-size: 12px;
    color: #263044;
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    word-break: break-word;
}

.ml-grid-footer[b-c0zaibnugy] {
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 14px 18px;
    border-top: 1px solid #e5e9f0;
    color: #263044;
    font-size: 13px;
}

.ml-page-size-box[b-c0zaibnugy] {
    min-width: 48px;
    padding: 8px 14px;
    border: 1px solid var(--ml-border);
    border-radius: 10px;
    background: #ffffff;
    text-align: center;
    font-weight: 800;
}

.ml-footer-hint[b-c0zaibnugy] {
    justify-self: end;
    color: var(--ml-muted);
    font-size: 12px;
}

@media (max-width: 1100px) {
    .ml-detalle-grid[b-c0zaibnugy] {
        grid-template-columns: repeat(2, 1fr);
    }
    .ml-grid-footer[b-c0zaibnugy] {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .ml-footer-hint[b-c0zaibnugy] {
        justify-self: start;
    }
}

@media (max-width: 720px) {
    .monitor-logs-page[b-c0zaibnugy] {
        padding: 14px 12px;
    }
    .ml-detalle-grid[b-c0zaibnugy] {
        grid-template-columns: 1fr;
    }
}

/* /Pages/TorreControl/AceptarSolicitudModal.razor.rz.scp.css */
/* ====== Contenedor principal ====== */
.asv-modal[b-03az8be5ep] {
    --asv-bg: #ffffff;
    --asv-surface: #f8fafc;
    --asv-border: #e2e6f0;
    --asv-border-md: #c8d0e0;
    --asv-text: #23304d;
    --asv-muted: #6d7893;
    --asv-subtle: #b0b8c8;
    --asv-accent: #c22a3b;
    --asv-accent-dk: #a01e2c;
    --asv-accent-bg: #fdf0f1;
    --asv-accent-txt: #b02030;
    --asv-ok-bg: #dbeafe;
    --asv-ok-txt: #1d4ed8;
    --asv-ok-border: #bfdbfe;
    --asv-r-sm: 8px;
    --asv-r-md: 12px;
    --asv-shadow: 0 1px 4px rgba(0,0,0,.07);
    background: var(--asv-bg);
    color: var(--asv-text);
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;
    height: 85vh;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ====== Header ====== */
.asv-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.4rem 0.9rem;
    gap: 1rem;
    border-bottom: 1px solid var(--asv-border);
    flex-shrink: 0;
}

.asv-header-left[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}

.asv-header-icon[b-03az8be5ep] {
    width: 46px;
    min-width: 46px;
    height: 46px;
    border-radius: var(--asv-r-md);
    background: var(--asv-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .asv-header-icon[b-03az8be5ep]  .rzi {
        font-size: 1.45rem !important;
        color: var(--asv-accent) !important;
    }

.asv-title[b-03az8be5ep] {
    margin: 0 0 0.1rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--asv-text);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.asv-subtitle[b-03az8be5ep] {
    margin: 0;
    font-size: 0.8rem;
    color: var(--asv-muted);
}

.asv-close-btn[b-03az8be5ep] {
    width: 32px;
    height: 32px;
    border-radius: var(--asv-r-sm);
    background: transparent;
    border: 1px solid var(--asv-border);
    color: var(--asv-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .12s, color .12s;
}

    .asv-close-btn:hover[b-03az8be5ep] {
        background: var(--asv-surface);
        color: var(--asv-text);
    }

    .asv-close-btn[b-03az8be5ep]  .rzi {
        font-size: 1rem !important;
    }

/* ====== Body ====== */
.asv-body[b-03az8be5ep] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    padding: 1rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Un solo scroll: datos del viaje, ruta, mercancía y vehículos */
.asv-body-scroll[b-03az8be5ep] {
    flex: 1;
    min-height: 0;
    min-width: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-right: 4px;
    scrollbar-width: thin;
    scrollbar-color: var(--asv-border-md) transparent;
}

/* Evitar que el algoritmo flex encoja los hijos a cero cuando
   el contenedor tiene altura restringida — sin esto, bloques
   grandes como la tabla de mercancía colapsan y quedan ocultos
   detrás del overflow:hidden del wrapper. */
.asv-body-scroll > *[b-03az8be5ep] {
    flex-shrink: 0;
}

    .asv-body-scroll[b-03az8be5ep]::-webkit-scrollbar {
        width: 5px;
    }

    .asv-body-scroll[b-03az8be5ep]::-webkit-scrollbar-thumb {
        background: var(--asv-border-md);
        border-radius: 999px;
    }

/* ====== Secciones ====== */
.asv-section-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.35rem;
}

.asv-section-badge[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--asv-accent-bg);
    color: var(--asv-accent-txt);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .asv-section-badge[b-03az8be5ep]  .rzi {
        font-size: 0.78rem !important;
        color: var(--asv-accent-txt) !important;
    }

.asv-section-line[b-03az8be5ep] {
    flex: 1;
    height: 1px;
    background: var(--asv-border);
}

/* ====== Grids ====== */
.asv-form-grid[b-03az8be5ep] {
    display: grid;
    gap: 0.6rem 0.85rem;
}

.asv-grid-3[b-03az8be5ep] {
    grid-template-columns: repeat(3, 1fr);
}

.asv-grid-4[b-03az8be5ep] {
    grid-template-columns: repeat(4, 1fr);
}

/* ====== Radzen overrides ====== */
.asv-modal[b-03az8be5ep]  .rz-form-field {
    width: 100%;
}

.asv-modal[b-03az8be5ep]  .rz-form-field-label {
    font-size: 0.74rem !important;
    font-weight: 600 !important;
    color: var(--asv-muted) !important;
}

.asv-modal[b-03az8be5ep]  .rz-form-field-outlined > .rz-form-field-wrapper {
    border-color: var(--asv-border) !important;
    border-radius: var(--asv-r-md) !important;
    transition: border-color .14s, box-shadow .14s !important;
}

.asv-modal[b-03az8be5ep]  .rz-form-field-outlined:focus-within > .rz-form-field-wrapper {
    border-color: var(--asv-accent) !important;
    box-shadow: 0 0 0 3px rgba(194,42,59,.1) !important;
}

/* Campo bloqueado */
.asv-modal[b-03az8be5ep]  .rz-state-disabled .rz-form-field-wrapper {
    background: #f8fafc !important;
    border-color: var(--asv-border) !important;
}

.asv-locked-hint[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .68rem;
    color: var(--asv-muted);
    font-weight: 600;
    margin-top: 3px;
}

    .asv-locked-hint[b-03az8be5ep]  .rzi {
        font-size: .7rem !important;
        color: var(--asv-subtle) !important;
    }

/* ====== Tabla mercancías ====== */
.asv-table-wrap[b-03az8be5ep] {
    border: 1px solid var(--asv-border);
    border-radius: var(--asv-r-md);
    overflow: hidden;
}

.asv-table[b-03az8be5ep] {
    width: 100%;
    border-collapse: collapse;
    font-size: .875rem;
}

    .asv-table th[b-03az8be5ep] {
        background: var(--asv-surface);
        color: var(--asv-muted);
        font-size: .68rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
        padding: .55rem .85rem;
        border-bottom: 1px solid var(--asv-border);
        text-align: left;
        white-space: nowrap;
    }

    .asv-table td[b-03az8be5ep] {
        padding: .55rem .85rem;
        border-bottom: 1px solid var(--asv-border);
        color: var(--asv-text);
        vertical-align: middle;
    }

    .asv-table tbody tr:last-child td[b-03az8be5ep] {
        border-bottom: none;
    }

    .asv-table tbody tr:hover[b-03az8be5ep] {
        background: #fafbfc;
    }

.asv-row-selected[b-03az8be5ep] {
    background: rgba(194,42,59,.04) !important;
}

.asv-merc-nombre[b-03az8be5ep] {
    font-weight: 700;
    font-size: .875rem;
    color: var(--asv-text);
}

.asv-merc-sub[b-03az8be5ep] {
    font-size: .72rem;
    color: var(--asv-muted);
    margin-top: .1rem;
}

.asv-piezas-badge[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    background: var(--asv-ok-bg);
    color: var(--asv-ok-txt);
    border: 1px solid var(--asv-ok-border);
    font-size: .73rem;
    font-weight: 700;
    padding: .15rem .55rem;
    border-radius: 999px;
}

/* ====== Alerta error ====== */
.asv-alert-error[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .6rem .85rem;
    background: #fee2e2;
    border: 1px solid #fecaca;
    border-radius: var(--asv-r-md);
    color: #991b1b;
    font-size: .82rem;
    font-weight: 500;
    flex-shrink: 0;
}

    .asv-alert-error[b-03az8be5ep]  .rzi {
        font-size: 1rem !important;
    }

/* ====== Footer ====== */
.asv-footer[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.4rem;
    border-top: 1px solid var(--asv-border);
    background: var(--asv-bg);
    flex-shrink: 0;
    gap: 1rem;
}

.asv-footer-info[b-03az8be5ep] {
    display: flex;
    align-items: center;
}

.asv-sol-ref[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    font-weight: 700;
    color: var(--asv-muted);
    background: var(--asv-surface);
    border: 1px solid var(--asv-border);
    padding: .22rem .65rem;
    border-radius: 999px;
}

    .asv-sol-ref[b-03az8be5ep]  .rzi {
        font-size: .8rem !important;
    }

.asv-footer-actions[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.asv-btn-cancel[b-03az8be5ep] {
    background: var(--asv-bg);
    color: var(--asv-text);
    border: 1px solid var(--asv-border-md);
    border-radius: var(--asv-r-md);
    padding: 0.5rem 1.1rem;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .12s;
    box-shadow: var(--asv-shadow);
}

    .asv-btn-cancel:hover[b-03az8be5ep] {
        background: var(--asv-surface);
    }

.asv-btn-save[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--asv-accent);
    color: #fff;
    border: none;
    border-radius: var(--asv-r-md);
    padding: 0.52rem 1.3rem;
    font-size: 0.9rem;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    letter-spacing: .01em;
    box-shadow: 0 2px 10px rgba(194,42,59,.3);
    transition: background .13s, box-shadow .13s, transform .08s;
}

    .asv-btn-save:hover:not(:disabled)[b-03az8be5ep] {
        background: var(--asv-accent-dk);
        box-shadow: 0 4px 16px rgba(194,42,59,.4);
        transform: translateY(-1px);
    }

    .asv-btn-save:active:not(:disabled)[b-03az8be5ep] {
        transform: translateY(0);
    }

    .asv-btn-save:disabled[b-03az8be5ep] {
        opacity: .6;
        cursor: not-allowed;
    }

    .asv-btn-save[b-03az8be5ep]  .rzi {
        font-size: 1rem !important;
    }

@keyframes asv-spin-b-03az8be5ep {
    to {
        transform: rotate(360deg);
    }
}

.asv-spin[b-03az8be5ep]  .rzi {
    animation: asv-spin-b-03az8be5ep 1s linear infinite;
}

/* ═══════════════════════════════════════════════════════
   SECCIÓN RUTA
   ═══════════════════════════════════════════════════════ */
/* Fila Radzen: Origen | flecha | Destino */
.asv-ruta-row[b-03az8be5ep] {
    width: 100%;
    min-width: 0;
}

.asv-ruta-row[b-03az8be5ep]  .rz-g {
    min-width: 0;
    align-items: stretch;
}

/* Gana sobre padding/flex de .rz-col-md-* de Radzen en la fila de ruta */
.asv-ruta-row .asv-ruta-col[b-03az8be5ep] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.asv-ruta-row .asv-ruta-col--arrow[b-03az8be5ep] {
    flex: 0 0 36px !important;
    max-width: 36px !important;
}

.asv-ruta-row .asv-ruta-col:not(.asv-ruta-col--arrow)[b-03az8be5ep] {
    flex: 1 1 0% !important;
    max-width: none !important;
}

.asv-ruta-col[b-03az8be5ep] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.asv-ruta-col--arrow[b-03az8be5ep] {
    flex: 0 0 40px;
    max-width: 40px;
    padding-left: 0;
    padding-right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Flecha central */
.asv-ruta-arrow[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .35rem 0;
    color: var(--asv-muted);
    flex-shrink: 0;
}

    .asv-ruta-arrow[b-03az8be5ep]  .rzi {
        font-size: 1.3rem !important;
        color: var(--asv-muted) !important;
    }

/* Tarjeta de ubicación */
.asv-ruta-card[b-03az8be5ep] {
    border: 1px solid var(--asv-border);
    border-top-width: 3px;
    border-radius: var(--asv-r-md);
    background: #f8fafc;
    padding: .8rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    flex: 1;
}

.asv-ruta-card--origen[b-03az8be5ep] {
    border-top-color: #4f5dff;
}

.asv-ruta-card--destino[b-03az8be5ep] {
    border-top-color: #0d9488;
}

/* Header de tarjeta */
.asv-ruta-card-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    flex-wrap: wrap;
}

/* Badge ORIGEN / DESTINO */
.asv-ruta-badge[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: .2rem .65rem;
    border-radius: 999px;
    border: 1.5px solid transparent;
    flex-shrink: 0;
}

    .asv-ruta-badge[b-03az8be5ep]  .rzi {
        font-size: .72rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.asv-ruta-badge--origen[b-03az8be5ep] {
    background: #eff1ff;
    color: #4f5dff;
    border-color: #c7ccff;
}

.asv-ruta-badge--destino[b-03az8be5ep] {
    background: #f0fdfa;
    color: #0d9488;
    border-color: #99f6e4;
}

/* Fecha en header */
.asv-ruta-fecha[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--asv-muted);
}

    .asv-ruta-fecha[b-03az8be5ep]  .rzi {
        font-size: .75rem !important;
        line-height: 1 !important;
    }

/* Nombre del lugar */
.asv-ruta-nombre[b-03az8be5ep] {
    font-size: .95rem;
    font-weight: 800;
    color: var(--asv-text);
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--asv-border);
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
}

/* Grid de detalles */
.asv-ruta-detail-grid[b-03az8be5ep] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .25rem .5rem;
    min-width: 0;
}

.asv-ruta-detail-item[b-03az8be5ep] {
    display: grid;
    grid-template-columns: minmax(0, 88px) minmax(0, 1fr);
    gap: .25rem .4rem;
    align-items: start;
    min-width: 0;
}

.asv-ruta-detail-item--full[b-03az8be5ep] {
    grid-column: span 2;
}

.asv-ruta-lbl[b-03az8be5ep] {
    font-size: .72rem;
    font-weight: 700;
    color: var(--asv-text);
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.25;
}

.asv-ruta-val[b-03az8be5ep] {
    font-size: .78rem;
    color: var(--asv-text);
    font-weight: 500;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
}

.asv-ruta-val--link[b-03az8be5ep] {
    color: #4f5dff;
    font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
    .asv-ruta-detail-grid[b-03az8be5ep] {
        grid-template-columns: 1fr;
    }

    .asv-ruta-detail-item[b-03az8be5ep] {
        grid-template-columns: 1fr;
    }

    .asv-ruta-detail-item--full[b-03az8be5ep] {
        grid-column: span 1;
    }

    .asv-ruta-col--arrow[b-03az8be5ep] {
        display: none;
    }
}

/**/

/* ── Tipo transporte bloqueado ──────────────────────────── */
.asv-tipo-bloqueado[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: .75rem;
    background: #f8fafc;
    border: 1px solid var(--asv-border);
    border-radius: var(--asv-r-md);
    padding: .65rem 1rem;
}

    .asv-tipo-bloqueado[b-03az8be5ep]  .rzi {
        font-size: 1.1rem !important;
        color: var(--asv-muted) !important;
    }

.asv-tipo-lbl[b-03az8be5ep] {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--asv-muted);
    display: block;
}

.asv-tipo-val[b-03az8be5ep] {
    font-size: .9rem;
    font-weight: 700;
    color: var(--asv-text);
}

/* ── Botón agregar vehículo ─────────────────────────────── */
.asv-btn-add-viaje[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: var(--asv-accent-bg);
    color: var(--asv-accent);
    border: 1.5px solid rgba(194,42,59,.3);
    border-radius: 999px;
    padding: .22rem .75rem;
    font-size: .75rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background .12s, border-color .12s;
}

    .asv-btn-add-viaje:hover[b-03az8be5ep] {
        background: rgba(194,42,59,.12);
        border-color: var(--asv-accent);
    }

    .asv-btn-add-viaje:disabled[b-03az8be5ep],
    .asv-btn-add-viaje.is-disabled[b-03az8be5ep] {
        background: #f8fafc;
        border-color: var(--asv-border-md);
        color: var(--asv-muted);
        cursor: not-allowed;
        opacity: .65;
        box-shadow: none;
    }

    .asv-btn-add-viaje:disabled:hover[b-03az8be5ep],
    .asv-btn-add-viaje.is-disabled:hover[b-03az8be5ep] {
        background: #f8fafc;
        border-color: var(--asv-border-md);
    }

    .asv-btn-add-viaje[b-03az8be5ep]  .rzi {
        font-size: .85rem !important;
    }

/* ── Tarjeta de vehículo ────────────────────────────────── */
.asv-viaje-card[b-03az8be5ep] {
    border: 1px solid var(--asv-border);
    border-left: 3px solid var(--asv-accent);
    border-radius: var(--asv-r-md);
    background: #f8fafc;
    padding: .6rem .9rem;
    display: flex;
    flex-direction: column;
}

.asv-viaje-card-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .25rem;
}

.asv-viaje-num[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .8rem;
    font-weight: 800;
    color: var(--asv-accent);
}

    .asv-viaje-num[b-03az8be5ep]  .rzi {
        font-size: .9rem !important;
        color: var(--asv-accent) !important;
    }

.asv-viaje-del-btn[b-03az8be5ep] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid #fecaca;
    background: #fee2e2;
    color: #991b1b;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s;
}

    .asv-viaje-del-btn:hover[b-03az8be5ep] {
        background: #fca5a5;
    }

    .asv-viaje-del-btn[b-03az8be5ep]  .rzi {
        font-size: .85rem !important;
    }

/* Hint bloqueado dentro del cm-modal */
.cm-modal .cm-locked-hint[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .68rem;
    color: #6d7893;
    font-weight: 600;
    margin-top: 3px;
}

    .cm-modal .cm-locked-hint[b-03az8be5ep]  .rzi {
        font-size: .7rem !important;
    }

/* ── Tarjeta de vehículo (estilo mercancía) ─────────────── */
.asv-cargo-card[b-03az8be5ep] {
    background: #faf8f6;
    border: 1px solid #e2ddd8;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
}

.asv-cargo-card-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .6rem .9rem;
    border-bottom: 1px solid #e2ddd8;
    background: #f5f3f0;
}

.asv-cargo-title-row[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.asv-cargo-icon-box[b-03az8be5ep] {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: var(--asv-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .asv-cargo-icon-box[b-03az8be5ep]  .rzi {
        font-size: .9rem !important;
        color: var(--asv-accent) !important;
    }

.asv-cargo-title[b-03az8be5ep] {
    font-size: .88rem;
    font-weight: 800;
    color: var(--asv-text);
}

.asv-cargo-del-btn[b-03az8be5ep] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid #e2ddd8;
    background: transparent;
    color: var(--asv-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}

    .asv-cargo-del-btn:hover[b-03az8be5ep] {
        background: #fee2e2;
        border-color: #fecaca;
        color: #991b1b;
    }

    .asv-cargo-del-btn[b-03az8be5ep]  .rzi {
        font-size: .85rem !important;
    }

.asv-cargo-grid[b-03az8be5ep] {
    display: grid;
    gap: .6rem .75rem;
    padding: .75rem .9rem;
}

.asv-cargo-grid--top[b-03az8be5ep] {
    grid-template-columns: repeat(4, 1fr);
}

.asv-cargo-grid--bottom[b-03az8be5ep] {
    grid-template-columns: repeat(3, 1fr);
    padding-top: 0;
}

.asv-cargo-tipo-hint[b-03az8be5ep] {
    grid-column: 1 / -1;
    margin-top: -2px;
}

@media (max-width: 700px) {
    .asv-cargo-grid--top[b-03az8be5ep],
    .asv-cargo-grid--bottom[b-03az8be5ep] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ── Header de mercancía por viaje ─────────────────────── */
.asv-viaje-merc-header[b-03az8be5ep] {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem .9rem;
    border-top: 1px solid var(--asv-border);
    font-size: .75rem;
    font-weight: 700;
    color: var(--asv-muted);
    background: var(--asv-surface);
}

    .asv-viaje-merc-header[b-03az8be5ep]  .rzi {
        font-size: .85rem !important;
        color: var(--asv-muted) !important;
    }

.asv-viaje-merc-count[b-03az8be5ep] {
    margin-left: auto;
    font-size: .7rem;
    font-weight: 700;
    background: var(--asv-accent-bg);
    color: var(--asv-accent-txt);
    padding: .15rem .55rem;
    border-radius: 999px;
}

/* ── Tabla mercancía por viaje ──────────────────────────── */
.asv-viaje-merc-table-wrap[b-03az8be5ep] {
    border-top: 1px solid var(--asv-border);
}

.asv-viaje-merc-table-wrap .asv-table[b-03az8be5ep] {
    table-layout: fixed;
    width: 100%;
}

.asv-viaje-merc-table-wrap .asv-table td[b-03az8be5ep] {
    min-width: 0;
    vertical-align: top;
}

.asv-viaje-merc-table-wrap .asv-table th:nth-child(1)[b-03az8be5ep],
.asv-viaje-merc-table-wrap .asv-table td:nth-child(1)[b-03az8be5ep] {
    width: 38px;
}

.asv-viaje-merc-table-wrap .asv-table th:nth-child(2)[b-03az8be5ep],
.asv-viaje-merc-table-wrap .asv-table td:nth-child(2)[b-03az8be5ep] {
    width: 30%;
}

.asv-viaje-merc-table-wrap .asv-table th:nth-child(n+3)[b-03az8be5ep],
.asv-viaje-merc-table-wrap .asv-table td:nth-child(n+3)[b-03az8be5ep] {
    width: auto;
    min-width: 0;
    max-width: none;
}

.asv-viaje-merc-table-wrap .asv-table[b-03az8be5ep]  .rz-numeric {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100%;
    box-sizing: border-box !important;
}

.asv-viaje-merc-table-wrap .asv-table[b-03az8be5ep]  .rz-numeric .rz-numeric-input {
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Fila deseleccionada */
.asv-row-deselected td[b-03az8be5ep] {
    opacity: .45;
}

/* ── Badge de retorno ───────────────────────────────────── */
.asv-retorno-badge[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    background: #fef9c3;
    color: #854d0e;
    border: 1.5px solid #fde68a;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: .1rem .45rem;
    border-radius: 999px;
    margin-left: .35rem;
    vertical-align: middle;
    white-space: nowrap;
}

    .asv-retorno-badge[b-03az8be5ep]  .rzi {
        font-size: .65rem !important;
        color: #92400e !important;
    }

/* ── Fila agotada (ya distribuida 100% en otros vehículos) ─ */
.asv-row-agotada td[b-03az8be5ep] {
    opacity: .35;
    pointer-events: none;
}

.asv-agotada-chip[b-03az8be5ep] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .65rem;
    font-weight: 700;
    background: #f1f5f9;
    color: #94a3b8;
    border: 1px solid #e2e8f0;
    padding: .1rem .4rem;
    border-radius: 999px;
    margin-left: .3rem;
}

/* ── Indicador de cantidad restante disponible ──────────── */
.asv-remaining-hint[b-03az8be5ep] {
    font-size: .62rem;
    color: #64748b;
    margin-top: .1rem;
    display: block;
}

.asv-remaining-hint--warn[b-03az8be5ep] {
    color: #c2410c;
    font-weight: 700;
}
/* ====== Responsive ====== */
@media (max-width: 700px) {
    .asv-grid-3[b-03az8be5ep], .asv-grid-4[b-03az8be5ep] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .asv-grid-3[b-03az8be5ep], .asv-grid-4[b-03az8be5ep] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/TorreControl/AgregarMercanciaModal.razor.rz.scp.css */
/* ====== Contenedor principal ====== */
.am-modal[b-f9f91uustg] {
    --am-bg: #ffffff;
    --am-surface: #faf8f6;
    --am-border: #e2ddd8;
    --am-border-md: #cec8c1;
    --am-text: #1a2232;
    --am-muted: #7a8399;
    --am-subtle: #b0b8c8;
    --am-accent: #d63030;
    --am-accent-dk: #b02424;
    --am-accent-bg: #fdf0f0;
    --am-accent-text: #c02020;
    --am-warn: #f59e0b;
    --am-warn-bg: #fffbeb;
    --am-warn-text: #92400e;
    --am-r-sm: 8px;
    --am-r-md: 12px;
    --am-r-lg: 16px;
    --am-shadow-sm: 0 1px 4px rgba(0,0,0,.07);
    background: var(--am-bg);
    color: var(--am-text);
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;
    height: 80vh;
    height: 80dvh;
    max-height: 80vh;
    max-height: 80dvh;
    display: flex;
    /*flex-direction: column;
    overflow: hidden;*/
}

/* ====== Header ====== */
.am-header[b-f9f91uustg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.4rem 0.9rem;
    gap: 1rem;
    border-bottom: 1px solid var(--am-border);
    flex-shrink: 0;
    background: var(--am-bg);
}

.am-header-left[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}

.am-header-icon[b-f9f91uustg] {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: var(--am-r-md);
    background: var(--am-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .am-header-icon[b-f9f91uustg]  .rzi {
        font-size: 1.4rem !important;
        color: var(--am-accent) !important;
    }

.am-title[b-f9f91uustg] {
    margin: 0 0 0.12rem;
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--am-text);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.am-subtitle[b-f9f91uustg] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--am-muted);
}

.am-close-btn[b-f9f91uustg] {
    width: 32px;
    height: 32px;
    border-radius: var(--am-r-sm);
    background: transparent;
    border: 1px solid var(--am-border);
    color: var(--am-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .12s, border-color .12s, color .12s;
}

    .am-close-btn:hover[b-f9f91uustg] {
        background: var(--am-surface);
        border-color: var(--am-border-md);
        color: var(--am-text);
    }

    .am-close-btn[b-f9f91uustg]  .rzi {
        font-size: 1.05rem !important;
    }

/* ====== Body ====== */
.am-body[b-f9f91uustg] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    scrollbar-width: thin;
    scrollbar-color: var(--am-border-md) transparent;
}

    .am-body[b-f9f91uustg]::-webkit-scrollbar {
        width: 5px;
    }

    .am-body[b-f9f91uustg]::-webkit-scrollbar-track {
        background: transparent;
    }

    .am-body[b-f9f91uustg]::-webkit-scrollbar-thumb {
        background: var(--am-border-md);
        border-radius: 999px;
    }

/* ====== Sección headers ====== */
.am-section-header[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.4rem;
}

.am-section-badge[b-f9f91uustg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--am-accent-bg);
    color: var(--am-accent-text);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .am-section-badge[b-f9f91uustg]  .rzi {
        font-size: 0.8rem !important;
        color: var(--am-accent-text) !important;
    }

.am-section-badge-danger[b-f9f91uustg] {
    background: var(--am-warn-bg);
    color: var(--am-warn-text);
}

    .am-section-badge-danger[b-f9f91uustg]  .rzi {
        color: var(--am-warn) !important;
    }

.am-section-line[b-f9f91uustg] {
    flex: 1;
    height: 1px;
    background: var(--am-border);
}

/* ====== Grid de 4 columnas ====== */
.am-form-grid[b-f9f91uustg] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.65rem 0.85rem;
}

/* ====== Estilos Radzen ====== */
.am-modal[b-f9f91uustg]  .rz-form-field {
    width: 100%;
}

.am-modal[b-f9f91uustg]  .rz-form-field-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: var(--am-muted) !important;
    letter-spacing: 0.01em !important;
}

.am-modal[b-f9f91uustg]  .rz-form-field-outlined > .rz-form-field-wrapper {
    border-color: var(--am-border) !important;
    border-radius: var(--am-r-md) !important;
    transition: border-color .14s, box-shadow .14s !important;
}

.am-modal[b-f9f91uustg]  .rz-form-field-outlined:focus-within > .rz-form-field-wrapper {
    border-color: var(--am-accent) !important;
    box-shadow: 0 0 0 3px rgba(214,48,48,.1) !important;
}

.am-modal[b-f9f91uustg]  .rz-form-field-outlined:focus-within .rz-form-field-label {
    color: var(--am-accent) !important;
}

.am-modal[b-f9f91uustg]  .rz-textbox,
.am-modal[b-f9f91uustg]  .rz-numeric-input,
.am-modal[b-f9f91uustg]  input.rz-inputtext {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 0.875rem !important;
    color: var(--am-text) !important;
    font-family: inherit !important;
    padding: 0.35rem 0.6rem !important;
    width: 100% !important;
}

    .am-modal[b-f9f91uustg]  .rz-textbox::placeholder,
    .am-modal[b-f9f91uustg]  input.rz-inputtext::placeholder {
        color: var(--am-subtle) !important;
    }

.am-modal[b-f9f91uustg]  .rz-form-field .rz-dropdown {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    width: 100% !important;
    padding: 0 !important;
}

    .am-modal[b-f9f91uustg]  .rz-form-field .rz-dropdown .rz-dropdown-label {
        font-size: 0.875rem !important;
        color: var(--am-text) !important;
        padding: 0.35rem 0.6rem !important;
    }

    .am-modal[b-f9f91uustg]  .rz-form-field .rz-dropdown .rz-dropdown-trigger {
        color: var(--am-subtle) !important;
    }

/* ====== Checkbox peligrosa ====== */
.am-peligrosa-row[b-f9f91uustg] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.am-cargo-check-cell[b-f9f91uustg] {
    display: flex;
    align-items: center;
    border: 1px solid var(--am-border);
    border-radius: var(--am-r-md);
    padding: 0.45rem 0.85rem;
    background: transparent;
    min-height: 42px;
    min-width: 240px;
    box-sizing: border-box;
    transition: border-color .14s, box-shadow .14s;
    cursor: pointer;
}

.am-cargo-check-cell--active[b-f9f91uustg] {
    border-color: var(--am-warn);
    background: var(--am-warn-bg);
    box-shadow: 0 0 0 3px rgba(245,158,11,.12);
}

.am-cargo-check-label[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: var(--am-muted);
    font-weight: 600;
    user-select: none;
}

.am-cargo-check-cell--active .am-cargo-check-label[b-f9f91uustg] {
    color: var(--am-warn-text);
}

/* ====== Alerta de error ====== */
.am-alert-error[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    background: var(--am-accent-bg);
    border: 1px solid #f5c0c0;
    border-radius: var(--am-r-md);
    color: var(--am-accent-text);
    font-size: 0.83rem;
    font-weight: 500;
}

    .am-alert-error[b-f9f91uustg]  .rzi {
        font-size: 1rem !important;
    }

/* ====== Footer ====== */
.am-footer[b-f9f91uustg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.4rem;
    border-top: 1px solid var(--am-border);
    background: var(--am-bg);
    flex-shrink: 0;
    gap: 1rem;
}

.am-footer-info[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.am-footer-badge-danger[b-f9f91uustg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--am-warn-bg);
    color: var(--am-warn-text);
    border: 1px solid rgba(245,158,11,.3);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
}

    .am-footer-badge-danger[b-f9f91uustg]  .rzi {
        font-size: 0.82rem !important;
    }

.am-footer-actions[b-f9f91uustg] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.am-btn-cancel[b-f9f91uustg] {
    background: var(--am-bg);
    color: var(--am-text);
    border: 1px solid var(--am-border-md);
    border-radius: var(--am-r-md);
    padding: 0.5rem 1.05rem;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .12s, border-color .12s;
    box-shadow: var(--am-shadow-sm);
}

    .am-btn-cancel:hover[b-f9f91uustg] {
        background: var(--am-surface);
        border-color: var(--am-border-md);
    }

.am-btn-save[b-f9f91uustg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--am-accent);
    color: #fff;
    border: none;
    border-radius: var(--am-r-md);
    padding: 0.52rem 1.3rem;
    font-size: 0.9rem;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    letter-spacing: 0.01em;
    box-shadow: 0 2px 10px rgba(214,48,48,.3);
    transition: background .13s, box-shadow .13s, transform .08s;
}

    .am-btn-save:hover:not(:disabled)[b-f9f91uustg] {
        background: var(--am-accent-dk);
        box-shadow: 0 4px 16px rgba(214,48,48,.4);
        transform: translateY(-1px);
    }

    .am-btn-save:active:not(:disabled)[b-f9f91uustg] {
        transform: translateY(0);
    }

    .am-btn-save:disabled[b-f9f91uustg] {
        opacity: .65;
        cursor: not-allowed;
    }

    .am-btn-save[b-f9f91uustg]  .rzi {
        font-size: 1rem !important;
    }

@keyframes spin-b-f9f91uustg {
    to {
        transform: rotate(360deg);
    }
}

.am-btn-ico-spin[b-f9f91uustg]  .rzi {
    animation: spin-b-f9f91uustg 1s linear infinite;
}

/* ====== Responsive ====== */
@media (max-width: 700px) {
    .am-form-grid[b-f9f91uustg] {
        grid-template-columns: repeat(2, 1fr);
    }

    .am-peligrosa-row[b-f9f91uustg] {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .am-form-grid[b-f9f91uustg] {
        grid-template-columns: 1fr;
    }

    .am-title[b-f9f91uustg] {
        font-size: 1rem;
    }

    .am-subtitle[b-f9f91uustg] {
        display: none;
    }
}
/* /Pages/TorreControl/CrearOrdenModal.razor.rz.scp.css */
/* CrearOrdenModal - Layout fijo con footer siempre visible */

/* ====== Fix contenedor de Radzen ======
   Limpiamos padding y forzamos overflow hidden para que cm-modal
   controle su propio tamanio sin interferencia. */
/*.rz-dialog {
    overflow: hidden !important;
}

.rz-dialog-content {
    height: auto !important;
    padding: 0 !important;
    overflow: hidden !important;
}*/

.rz-dialog[b-lwjnn28krv] {
    overflow: hidden !important;
    max-height: 90vh !important;
    max-height: 90dvh !important;
    display: flex !important;
    flex-direction: column !important;
}

.rz-dialog-content[b-lwjnn28krv] {
    flex: 0 1 auto !important;
    min-height: 0 !important;  par m�gico para flex 
    padding: 0 !important;
    overflow: hidden !important;
}

/* ====== Contenedor principal ====== */
.cm-modal[b-lwjnn28krv] {
    /* Variables de tema */
    --cm-bg:          #ffffff;
    --cm-surface:     #faf8f6;
    --cm-border:      #e2ddd8;
    --cm-border-md:   #cec8c1;
    --cm-text:        #1a2232;
    --cm-muted:       #7a8399;
    --cm-subtle:      #b0b8c8;
    --cm-accent:      #d63030;
    --cm-accent-dk:   #b02424;
    --cm-accent-bg:   #fdf0f0;
    --cm-accent-text: #c02020;
    --cm-r-sm: 8px;
    --cm-r-md: 12px;
    --cm-r-lg: 16px;
    --cm-shadow-sm: 0 1px 4px rgba(0,0,0,.07);

    background: var(--cm-bg);
    color: var(--cm-text);
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;

    /* Altura explicita en unidades de viewport - no depende de la cadena
       de herencia de Radzen. dvh descuenta la barra del navegador en movil,
       con vh como fallback para navegadores que no soporten dvh. */
    height: auto;
    max-height: 90vh;
    max-height: 90dvh;

    /* Flex column para que el footer siempre quede anclado abajo */
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.cm-modal[b-lwjnn28krv]  form {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: inherit;
}

/* ====== Header - no scrollea ====== */
.cm-header[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.4rem 0.9rem;
    gap: 1rem;
    border-bottom: 1px solid var(--cm-border);
    flex-shrink: 0;
    background: var(--cm-bg);
}

.cm-header-left[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}

.cm-header-icon[b-lwjnn28krv] {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: var(--cm-r-md);
    background: var(--cm-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cm-header-icon[b-lwjnn28krv]  .rzi {
    font-size: 1.4rem !important;
    color: var(--cm-accent) !important;
}

.cm-title[b-lwjnn28krv] {
    margin: 0 0 0.12rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--cm-text);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.cm-subtitle[b-lwjnn28krv] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--cm-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cm-close-btn[b-lwjnn28krv] {
    width: 32px;
    height: 32px;
    border-radius: var(--cm-r-sm);
    background: transparent;
    border: 1px solid var(--cm-border);
    color: var(--cm-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .12s, border-color .12s, color .12s;
}

.cm-close-btn:hover[b-lwjnn28krv] {
    background: var(--cm-surface);
    border-color: var(--cm-border-md);
    color: var(--cm-text);
}

.cm-close-btn[b-lwjnn28krv]  .rzi { font-size: 1.05rem !important; }

/* ====== Body - scrollea todo el contenido ======
   flex:1 + min-height:0 es el par magico para que el body crezca
   hasta el espacio disponible y luego scrollee en lugar de
   empujar al footer fuera de pantalla. */
.cm-body[b-lwjnn28krv] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    scrollbar-width: thin;
    scrollbar-color: var(--cm-border-md) transparent;
}

.cm-body[b-lwjnn28krv]::-webkit-scrollbar { width: 5px; }
.cm-body[b-lwjnn28krv]::-webkit-scrollbar-track { background: transparent; }
.cm-body[b-lwjnn28krv]::-webkit-scrollbar-thumb {
    background: var(--cm-border-md);
    border-radius: 999px;
}

/* ====== Seccion headers ====== */
.cm-section-header[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.6rem;
}

.cm-section-header-inline[b-lwjnn28krv] { margin-bottom: 0.4rem; }

.cm-section-badge[b-lwjnn28krv] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--cm-accent-bg);
    color: var(--cm-accent-text);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

.cm-section-badge[b-lwjnn28krv]  .rzi {
    font-size: 0.8rem !important;
    color: var(--cm-accent-text) !important;
}

.cm-section-line[b-lwjnn28krv] {
    flex: 1;
    height: 1px;
    background: var(--cm-border);
}

/* ====== Grid principal de campos ====== */
.cm-form-grid[b-lwjnn28krv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.65rem 0.85rem;
}

.cm-notes-inline[b-lwjnn28krv] {
    grid-column: span 2;
}

.cm-notes-inline[b-lwjnn28krv]  .rz-form-field-wrapper {
    min-height: 60px;
}

/* ====== Estilos de RadzenFormField (Outlined) ======
   Ajustamos colores y tamanos para que coincidan con el tema. */

/* Contenedor del form field */
.cm-modal[b-lwjnn28krv]  .rz-form-field {
    width: 100%;
}

/* El label flotante */
.cm-modal[b-lwjnn28krv]  .rz-form-field-label {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: var(--cm-muted) !important;
    letter-spacing: 0.01em !important;
}

/* Border del outlined */
.cm-modal[b-lwjnn28krv]  .rz-form-field-outlined > .rz-form-field-wrapper {
    border-color: var(--cm-border) !important;
    border-radius: var(--cm-r-md) !important;
    transition: border-color .14s, box-shadow .14s !important;
}

/* Focus del outlined */
.cm-modal[b-lwjnn28krv]  .rz-form-field-outlined:focus-within > .rz-form-field-wrapper {
    border-color: var(--cm-accent) !important;
    box-shadow: 0 0 0 3px rgba(214,48,48,.1) !important;
}

/* Label en focus */
.cm-modal[b-lwjnn28krv]  .rz-form-field-outlined:focus-within .rz-form-field-label {
    color: var(--cm-accent) !important;
}

/* Inputs internos de RadzenTextBox, RadzenNumeric, RadzenDatePicker */
.cm-modal[b-lwjnn28krv]  .rz-textbox,
.cm-modal[b-lwjnn28krv]  .rz-numeric-input,
.cm-modal[b-lwjnn28krv]  input.rz-inputtext {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 0.875rem !important;
    color: var(--cm-text) !important;
    font-family: inherit !important;
    padding: 0.35rem 0.6rem !important;
    width: 100% !important;
}

.cm-modal[b-lwjnn28krv]  .rz-textbox::placeholder,
.cm-modal[b-lwjnn28krv]  input.rz-inputtext::placeholder {
    color: var(--cm-subtle) !important;
}

/* RadzenTextArea */
.cm-modal[b-lwjnn28krv]  .rz-textarea {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 0.875rem !important;
    color: var(--cm-text) !important;
    font-family: inherit !important;
    resize: none !important;
    width: 100% !important;
    padding: 0.4rem 0.6rem !important;
}

.cm-modal[b-lwjnn28krv]  .rz-textarea::placeholder {
    color: var(--cm-subtle) !important;
}

/* RadzenDropDown dentro de RadzenFormField */
.cm-modal[b-lwjnn28krv]  .rz-form-field .rz-dropdown {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    width: 100% !important;
    padding: 0 !important;
}

.cm-modal[b-lwjnn28krv]  .rz-form-field .rz-dropdown .rz-dropdown-label {
    font-size: 0.875rem !important;
    color: var(--cm-text) !important;
    padding: 0.35rem 0.6rem !important;
}

.cm-modal[b-lwjnn28krv]  .rz-form-field .rz-dropdown .rz-dropdown-trigger {
    color: var(--cm-subtle) !important;
}

/* RadzenDatePicker icono */
.cm-modal[b-lwjnn28krv]  .rz-form-field .rz-datepicker .rz-button {
    color: var(--cm-subtle) !important;
    background: transparent !important;
    border: none !important;
}

/* ====== Fila compacta para agregar mercancia ====== */
.cm-add-row[b-lwjnn28krv] {
    display: flex;
    justify-content: flex-end;
    margin-top: -0.1rem;
}

.cm-btn-add-cargo[b-lwjnn28krv] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--cm-accent);
    color: #fff;
    border: none;
    border-radius: var(--cm-r-md);
    padding: 0.55rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(214,48,48,.25);
    transition: background .13s, box-shadow .13s, transform .08s;
}

.cm-btn-add-cargo:hover[b-lwjnn28krv] {
    background: var(--cm-accent-dk);
    box-shadow: 0 4px 14px rgba(214,48,48,.35);
    transform: translateY(-1px);
}

.cm-btn-add-cargo:active[b-lwjnn28krv] { transform: translateY(0); }

.cm-add-ico[b-lwjnn28krv]  .rzi { font-size: 1rem !important; }

/* ====== Area de scroll de mercancia ======
   Tiene su propio tope para no hacer una lista infinita.
   Cuando supera ese tope, scrollea SOLO la lista de cards. */
.cm-cargo-scroll-area[b-lwjnn28krv] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    /*max-height: 400px;*/
    max-height: min(400px, 38vh);
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    padding-right: 3px;
    flex-shrink: 1;
    scrollbar-width: thin;
    scrollbar-color: var(--cm-border-md) transparent;
}

.cm-cargo-scroll-area[b-lwjnn28krv]::-webkit-scrollbar { width: 4px; }
.cm-cargo-scroll-area[b-lwjnn28krv]::-webkit-scrollbar-track { background: transparent; }
.cm-cargo-scroll-area[b-lwjnn28krv]::-webkit-scrollbar-thumb {
    background: var(--cm-border-md);
    border-radius: 999px;
}

/* ====== Card de mercancia ====== */
.cm-cargo-card[b-lwjnn28krv] {
    background: var(--cm-surface);
    border: 1px solid var(--cm-border);
    border-radius: var(--cm-r-lg);
    overflow: hidden;
    box-shadow: var(--cm-shadow-sm);
    flex-shrink: 0;
}

.cm-cargo-card-header[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.55rem 0.85rem;
    border-bottom: 1px solid var(--cm-border);
    background: var(--cm-surface);
}

.cm-cargo-title-row[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.cm-cargo-icon-box[b-lwjnn28krv] {
    width: 26px;
    height: 26px;
    border-radius: var(--cm-r-sm);
    background: var(--cm-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cm-cargo-icon-box[b-lwjnn28krv]  .rzi {
    font-size: 0.88rem !important;
    color: var(--cm-accent) !important;
}

.cm-cargo-title[b-lwjnn28krv] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cm-text);
}

.cm-cargo-del-btn[b-lwjnn28krv] {
    width: 28px;
    height: 28px;
    border-radius: var(--cm-r-sm);
    background: transparent;
    border: 1px solid var(--cm-border);
    color: var(--cm-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}

.cm-cargo-del-btn:hover[b-lwjnn28krv] {
    background: var(--cm-accent-bg);
    border-color: #f5c0c0;
    color: var(--cm-accent);
}

.cm-cargo-del-btn[b-lwjnn28krv]  .rzi { font-size: 0.95rem !important; }

/* Grid de campos de la mercancia (4 columnas) */
.cm-cargo-grid[b-lwjnn28krv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.55rem 0.7rem;
    padding: 0.7rem 0.85rem;
}

/* ====== Footer - no scrollea, siempre visible ====== */
.cm-footer[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.4rem;
    border-top: 1px solid var(--cm-border);
    background: var(--cm-bg);
    flex-shrink: 0;
    gap: 1rem;
}

.cm-footer-steps[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.38rem;
}

.cm-step[b-lwjnn28krv] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--cm-border-md);
    display: inline-block;
    transition: background .15s;
}

.cm-step-done[b-lwjnn28krv]   { background: var(--cm-accent-bg); border: 2px solid var(--cm-accent); }
.cm-step-active[b-lwjnn28krv] { background: var(--cm-accent); }

.cm-step-line[b-lwjnn28krv] {
    width: 24px;
    height: 3px;
    border-radius: 999px;
    background: var(--cm-border);
    display: inline-block;
    margin-left: 0.12rem;
}

.cm-footer-actions[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.cm-btn-cancel[b-lwjnn28krv] {
    background: var(--cm-bg);
    color: var(--cm-text);
    border: 1px solid var(--cm-border-md);
    border-radius: var(--cm-r-md);
    padding: 0.5rem 1.05rem;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .12s, border-color .12s;
    box-shadow: var(--cm-shadow-sm);
}

.cm-btn-cancel:hover[b-lwjnn28krv] {
    background: var(--cm-surface);
    border-color: var(--cm-border-md);
}

.cm-btn-save[b-lwjnn28krv] {
    background: var(--cm-accent);
    color: #fff;
    border: none;
    border-radius: var(--cm-r-md);
    padding: 0.52rem 1.3rem;
    font-size: 0.9rem;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    letter-spacing: 0.01em;
    box-shadow: 0 2px 10px rgba(214,48,48,.3);
    transition: background .13s, box-shadow .13s, transform .08s;
}

.cm-btn-save:hover[b-lwjnn28krv] {
    background: var(--cm-accent-dk);
    box-shadow: 0 4px 16px rgba(214,48,48,.4);
    transform: translateY(-1px);
}

.cm-btn-save:active[b-lwjnn28krv] { transform: translateY(0); }

/* ====== Alerta de error ====== */
.cm-alert-error[b-lwjnn28krv] {
    margin: 0 1.4rem 0.85rem;
    padding: 0.6rem 0.85rem;
    background: var(--cm-accent-bg);
    border: 1px solid #f5c0c0;
    border-radius: var(--cm-r-md);
    color: var(--cm-accent-text);
    font-size: 0.83rem;
    font-weight: 500;
}

/* ====== Celda de checkbox en cargo grid ====== */
.cm-cargo-check-cell[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    border: 1px solid var(--cm-border);
    border-radius: var(--cm-r-md);
    padding: 0.35rem 0.6rem;
    background: transparent;
    min-height: 42px; /* misma altura que los RadzenFormField outlined */
    box-sizing: border-box;
}

.cm-cargo-check-label[b-lwjnn28krv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: var(--cm-muted);
    font-weight: 600;
    user-select: none;
}

/* Cambia el color del texto cuando est� marcado */
.cm-cargo-check-cell:has(input:checked) .cm-cargo-check-label[b-lwjnn28krv] {
    color: var(--cm-accent);
}

/* Borde rojo cuando est� marcado, igual que el focus de los otros campos */
.cm-cargo-check-cell:has(input:checked)[b-lwjnn28krv] {
    border-color: var(--cm-accent);
    box-shadow: 0 0 0 3px rgba(214,48,48,.1);
}

/* ====== Estado de carga ====== */
.cm-loading-state[b-lwjnn28krv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex: 1;
    min-height: 300px;
    color: var(--cm-muted);
}

.cm-loading-text[b-lwjnn28krv] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--cm-muted);
}

/* ====== RESPONSIVE ====== */

/* Pantallas con poca altura (zoom alto, monitores pequenos) */
/*@media (max-height: 700px) {
    .cm-modal {
        height: auto;
        max-height: 98vh;
        max-height: 98dvh;
    }
    .cm-cargo-scroll-area { max-height: 220px; }
    .cm-body { gap: 0.6rem; padding: 0.7rem 1.2rem; }
    .cm-header { padding: 0.7rem 1.2rem 0.65rem; }
    .cm-footer { padding: 0.65rem 1.2rem; }
}*/

@media (max-height: 700px) {
    .cm-modal[b-lwjnn28krv] {
        height: auto;
        max-height: 98vh;
        max-height: 98dvh;
    }

    .cm-cargo-scroll-area[b-lwjnn28krv] {
        max-height: min(200px, 28vh);
    }
    .cm-body[b-lwjnn28krv] {
        gap: 0.6rem;
        padding: 0.7rem 1.2rem;
    }
    .cm-header[b-lwjnn28krv] {
        padding: 0.7rem 1.2rem 0.65rem;
    }
    .cm-footer[b-lwjnn28krv] {
        padding: 0.65rem 1.2rem;
    }
}

/* Tablet: 2 columnas en el form */
@media (max-width: 860px) {
    .cm-form-grid[b-lwjnn28krv]  { grid-template-columns: repeat(2, 1fr); }
    .cm-notes-inline[b-lwjnn28krv] { grid-column: span 1; }
    .cm-cargo-grid[b-lwjnn28krv] { grid-template-columns: repeat(2, 1fr); }
    .cm-cargo-scroll-area[b-lwjnn28krv] { max-height: 360px; }
}

/* Tablet pequena / movil grande */
@media (max-width: 640px) {
    .cm-header[b-lwjnn28krv] { padding: 0.85rem 1rem 0.75rem; }
    .cm-body[b-lwjnn28krv]   { padding: 0.85rem 1rem; gap: 0.75rem; }
    .cm-footer[b-lwjnn28krv] { padding: 0.75rem 1rem; }

    /*.cm-obs-row { flex-direction: column; }
    .cm-obs-action {
        padding-top: 0;
        width: 100%;
    }*/
    .cm-btn-add-cargo[b-lwjnn28krv] {
        width: 100%;
        justify-content: center;
    }

    .cm-footer-steps[b-lwjnn28krv]  { display: none; }
    .cm-footer-actions[b-lwjnn28krv] { width: 100%; justify-content: flex-end; }
    .cm-cargo-scroll-area[b-lwjnn28krv] { max-height: 300px; }
}

/* Movil: 1 columna */
@media (max-width: 480px) {
    .cm-form-grid[b-lwjnn28krv]  { grid-template-columns: 1fr; }
    .cm-cargo-grid[b-lwjnn28krv] { grid-template-columns: 1fr; }
    .cm-notes-inline[b-lwjnn28krv] { grid-column: span 1; }

    .cm-title[b-lwjnn28krv]    { font-size: 1.1rem; }
    .cm-subtitle[b-lwjnn28krv] { display: none; }

    .cm-btn-cancel[b-lwjnn28krv],
    .cm-btn-save[b-lwjnn28krv] {
        font-size: 0.82rem;
        padding: 0.45rem 0.8rem;
    }

    .cm-cargo-scroll-area[b-lwjnn28krv] { max-height: 250px; }
}
/* ====== Loading overlay inicial ====== */
.cm-modal[b-lwjnn28krv] {
    position: relative;
}

.cm-loading-overlay[b-lwjnn28krv] {
    position: absolute;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.74);
    backdrop-filter: blur(2px);
    pointer-events: all;
}

.cm-loading-card[b-lwjnn28krv] {
    min-width: 300px;
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: 1rem 1.15rem;
    border: 1px solid var(--cm-border);
    border-radius: var(--cm-r-lg);
    background: #fff;
    box-shadow: 0 16px 36px rgba(15, 23, 42, .16);
}

.cm-spinner[b-lwjnn28krv] {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    border: 3px solid #f1d4d4;
    border-top-color: var(--cm-accent);
    animation: cmSpin-b-lwjnn28krv .85s linear infinite;
    flex-shrink: 0;
}

.cm-loading-title[b-lwjnn28krv] {
    color: var(--cm-text);
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.15;
}

.cm-loading-sub[b-lwjnn28krv] {
    margin-top: .2rem;
    color: var(--cm-muted);
    font-size: .78rem;
    font-weight: 600;
}

.cm-close-btn[disabled][b-lwjnn28krv],
.cm-btn-cancel[disabled][b-lwjnn28krv],
.cm-btn-save[disabled][b-lwjnn28krv],
.cm-btn-add-cargo[disabled][b-lwjnn28krv] {
    opacity: .6;
    cursor: not-allowed;
    pointer-events: none;
}

@keyframes cmSpin-b-lwjnn28krv {
    to { transform: rotate(360deg); }
}
/* /Pages/TorreControl/GenerarSolicitudProveedorModal.razor.rz.scp.css */
/* ====== Variables y contenedor ====== */
.gsp-modal[b-fa8andguwt] {
    --gsp-bg: #ffffff;
    --gsp-surface: #f8fafc;
    --gsp-border: #e2e6f0;
    --gsp-border-md: #c8d0e0;
    --gsp-text: #23304d;
    --gsp-muted: #6d7893;
    --gsp-subtle: #b0b8c8;
    --gsp-accent: #c22a3b;
    --gsp-accent-dk: #a01e2c;
    --gsp-accent-bg: #fdf0f1;
    --gsp-accent-text: #b02030;
    --gsp-warn: #f59e0b;
    --gsp-warn-bg: #fffbeb;
    --gsp-warn-text: #92400e;
    --gsp-ok-bg: #dbeafe;
    --gsp-ok-text: #1d4ed8;
    --gsp-ok-border: #bfdbfe;
    --gsp-error-bg: #fee2e2;
    --gsp-error-text: #991b1b;
    --gsp-r-sm: 8px;
    --gsp-r-md: 12px;
    --gsp-r-lg: 16px;
    --gsp-shadow: 0 1px 4px rgba(0,0,0,.07);
    background: var(--gsp-bg);
    color: var(--gsp-text);
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;
    height: 80vh;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
}

/* ====== Form layout (evita espacio en blanco) ====== */
.gsp-modal[b-fa8andguwt]  form.gsp-form {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* Asegura que el footer quede pegado abajo */
.gsp-footer[b-fa8andguwt] {
    margin-top: auto;
}

/* ====== Loading overlay (bloquea interacción) ====== */
.gsp-loading-overlay[b-fa8andguwt] {
    position: absolute;
    inset: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: all;
}

.gsp-loading-card[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border-radius: var(--gsp-r-lg);
    border: 1px solid var(--gsp-border);
    background: var(--gsp-bg);
    box-shadow: 0 10px 28px rgba(0,0,0,.12);
    min-width: 260px;
}

.gsp-spinner[b-fa8andguwt] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 3px solid var(--gsp-border);
    border-top-color: var(--gsp-accent);
    animation: gspSpin-b-fa8andguwt .9s linear infinite;
    flex-shrink: 0;
}

.gsp-loading-title[b-fa8andguwt] {
    font-weight: 800;
    font-size: 0.9rem;
    color: var(--gsp-text);
    line-height: 1.1;
}

.gsp-loading-sub[b-fa8andguwt] {
    font-weight: 600;
    font-size: 0.78rem;
    color: var(--gsp-muted);
    margin-top: 2px;
}

@keyframes gspSpin-b-fa8andguwt {
    to { transform: rotate(360deg); }
}

/* ====== Header ====== */
.gsp-header[b-fa8andguwt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.4rem 0.9rem;
    gap: 1rem;
    border-bottom: 1px solid var(--gsp-border);
    flex-shrink: 0;
    background: var(--gsp-bg);
}

.gsp-header-left[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}

.gsp-header-icon[b-fa8andguwt] {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: var(--gsp-r-md);
    background: var(--gsp-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .gsp-header-icon[b-fa8andguwt]  .rzi {
        font-size: 1.4rem !important;
        color: var(--gsp-accent) !important;
    }

.gsp-title[b-fa8andguwt] {
    margin: 0 0 0.1rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--gsp-text);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.gsp-subtitle[b-fa8andguwt] {
    margin: 0;
    font-size: 0.8rem;
    color: var(--gsp-muted);
}

.gsp-close-btn[b-fa8andguwt] {
    width: 32px;
    height: 32px;
    border-radius: var(--gsp-r-sm);
    background: transparent;
    border: 1px solid var(--gsp-border);
    color: var(--gsp-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .12s, color .12s;
}

.gsp-close-btn[disabled][b-fa8andguwt] {
    opacity: .55;
    cursor: not-allowed;
    pointer-events: none;
}

    .gsp-close-btn:hover[b-fa8andguwt] {
        background: var(--gsp-surface);
        color: var(--gsp-text);
    }

    .gsp-close-btn[b-fa8andguwt]  .rzi {
        font-size: 1rem !important;
    }

/* ====== Body ====== */
.gsp-body[b-fa8andguwt] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    scrollbar-width: thin;
    scrollbar-color: var(--gsp-border-md) transparent;
}

    .gsp-body[b-fa8andguwt]::-webkit-scrollbar {
        width: 5px;
    }

    .gsp-body[b-fa8andguwt]::-webkit-scrollbar-thumb {
        background: var(--gsp-border-md);
        border-radius: 999px;
    }

/* ====== Secciones ====== */
.gsp-section-header[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.35rem;
}

.gsp-section-badge[b-fa8andguwt] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--gsp-accent-bg);
    color: var(--gsp-accent-text);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .gsp-section-badge[b-fa8andguwt]  .rzi {
        font-size: 0.78rem !important;
        color: var(--gsp-accent-text) !important;
    }

.gsp-section-line[b-fa8andguwt] {
    flex: 1;
    height: 1px;
    background: var(--gsp-border);
}

.gsp-retorno-picker[b-fa8andguwt] {
    display: grid;
    grid-template-columns: minmax(260px, 420px) 1fr;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px dashed var(--gsp-border-md);
    border-radius: var(--gsp-r-md);
    background: #fff7f8;
}

.gsp-retorno-help[b-fa8andguwt] {
    color: var(--gsp-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.gsp-retorno-info[b-fa8andguwt] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.65rem 0.85rem;
    margin-bottom: 0.85rem;
    border-radius: var(--gsp-r-md);
    border: 1px solid #c7d2fe;
    background: #eef2ff;
    color: #312e81;
    font-size: 0.82rem;
    line-height: 1.4;
}

.gsp-retorno-info--warn[b-fa8andguwt] {
    border-color: #fcd34d;
    background: #fffbeb;
    color: #92400e;
}

.gsp-retorno-captura[b-fa8andguwt] {
    border: 1px dashed var(--gsp-border-md);
    border-radius: var(--gsp-r-md);
    background: #fff7f8;
    padding: 0.75rem;
}

.gsp-retorno-captura .gsp-retorno-help[b-fa8andguwt] {
    margin-bottom: 0.65rem;
}

.gsp-empty-inline[b-fa8andguwt] {
    border: 1px solid var(--gsp-border);
    border-radius: var(--gsp-r-md);
    background: var(--gsp-surface);
    color: var(--gsp-muted);
    font-size: 0.82rem;
    font-style: italic;
    padding: 0.75rem 0.9rem;
}

.gsp-ida-section[b-fa8andguwt] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    flex-shrink: 0;
}

.gsp-icon-danger[b-fa8andguwt] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid #fecdd3;
    color: var(--gsp-accent);
    background: #fff1f2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.gsp-icon-danger:hover[b-fa8andguwt] {
    background: #ffe4e6;
}

.gsp-icon-danger[b-fa8andguwt]  .rzi {
    font-size: 1rem !important;
}

/* ====== Grids ====== */
.gsp-form-grid[b-fa8andguwt] {
    display: grid;
    gap: 0.6rem 0.85rem;
}

.gsp-grid-2[b-fa8andguwt] {
    grid-template-columns: repeat(2, 1fr);
}

.gsp-grid-3[b-fa8andguwt] {
    grid-template-columns: repeat(3, 1fr);
}

/* ====== Estilos Radzen ====== */
.gsp-modal[b-fa8andguwt]  .rz-form-field {
    width: 100%;
}

.gsp-modal[b-fa8andguwt]  .rz-form-field-label {
    font-size: 0.74rem !important;
    font-weight: 600 !important;
    color: var(--gsp-muted) !important;
}

.gsp-modal[b-fa8andguwt]  .rz-form-field-outlined > .rz-form-field-wrapper {
    border-color: var(--gsp-border) !important;
    border-radius: var(--gsp-r-md) !important;
    transition: border-color .14s, box-shadow .14s !important;
}

.gsp-modal[b-fa8andguwt]  .rz-form-field-outlined:focus-within > .rz-form-field-wrapper {
    border-color: var(--gsp-accent) !important;
    box-shadow: 0 0 0 3px rgba(194,42,59,.1) !important;
}

.gsp-modal[b-fa8andguwt]  .rz-textbox,
.gsp-modal[b-fa8andguwt]  .rz-numeric-input,
.gsp-modal[b-fa8andguwt]  input.rz-inputtext {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 0.875rem !important;
    color: var(--gsp-text) !important;
    font-family: inherit !important;
}

/* ====== Tabla mercancías ====== */
.gsp-table-wrap[b-fa8andguwt] {
    border: 1px solid var(--gsp-border);
    border-radius: var(--gsp-r-md);
    overflow: hidden;
}

.gsp-table[b-fa8andguwt] {
    width: 100%;
    border-collapse: collapse;
    font-size: .875rem;
}

    .gsp-table th[b-fa8andguwt] {
        background: var(--gsp-surface);
        color: var(--gsp-muted);
        font-size: .68rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
        padding: .6rem .85rem;
        border-bottom: 1px solid var(--gsp-border);
        text-align: left;
        white-space: nowrap;
    }

    .gsp-table td[b-fa8andguwt] {
        padding: .6rem .85rem;
        border-bottom: 1px solid var(--gsp-border);
        color: var(--gsp-text);
        vertical-align: middle;
    }

    .gsp-table tbody tr:last-child td[b-fa8andguwt] {
        border-bottom: none;
    }

    .gsp-table tbody tr:hover[b-fa8andguwt] {
        background: #fafbfc;
    }

/* Fila con error */
.gsp-row-error[b-fa8andguwt] {
    background: #fff8f8 !important;
}

.gsp-merc-nombre[b-fa8andguwt] {
    font-weight: 700;
    font-size: .875rem;
    color: var(--gsp-text);
}

.gsp-merc-sub[b-fa8andguwt] {
    font-size: .72rem;
    color: var(--gsp-muted);
    margin-top: .1rem;
}

.gsp-disponible[b-fa8andguwt] {
    display: inline-flex;
    align-items: center;
    background: var(--gsp-ok-bg);
    color: var(--gsp-ok-text);
    border: 1px solid var(--gsp-ok-border);
    font-size: .73rem;
    font-weight: 700;
    padding: .15rem .55rem;
    border-radius: 999px;
}

/* Numeric con error */
.gsp-numeric-wrap[b-fa8andguwt] {
    position: relative;
}

.gsp-numeric-error[b-fa8andguwt]  .rz-form-field-outlined > .rz-form-field-wrapper {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239,68,68,.12) !important;
}

.gsp-field-error[b-fa8andguwt] {
    font-size: .68rem;
    color: #dc2626;
    font-weight: 600;
    margin-top: 2px;
}

/* ====== Alerta error ====== */
.gsp-alert-error[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    background: var(--gsp-error-bg);
    border: 1px solid #fecaca;
    border-radius: var(--gsp-r-md);
    color: var(--gsp-error-text);
    font-size: 0.82rem;
    font-weight: 500;
}

    .gsp-alert-error[b-fa8andguwt]  .rzi {
        font-size: 1rem !important;
    }

/* ====== Footer ====== */
.gsp-footer[b-fa8andguwt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.4rem;
    border-top: 1px solid var(--gsp-border);
    background: var(--gsp-bg);
    flex-shrink: 0;
    gap: 1rem;
}

.gsp-footer-info[b-fa8andguwt] {
    display: flex;
    align-items: center;
}

.gsp-footer-warn[b-fa8andguwt] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: var(--gsp-warn-bg);
    color: var(--gsp-warn-text);
    border: 1px solid rgba(245,158,11,.3);
    font-size: .75rem;
    font-weight: 700;
    padding: .22rem .65rem;
    border-radius: 999px;
}

    .gsp-footer-warn[b-fa8andguwt]  .rzi {
        font-size: .8rem !important;
    }

.gsp-footer-actions[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.gsp-btn-cancel[b-fa8andguwt] {
    background: var(--gsp-bg);
    color: var(--gsp-text);
    border: 1px solid var(--gsp-border-md);
    border-radius: var(--gsp-r-md);
    padding: 0.5rem 1.1rem;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .12s;
    box-shadow: var(--gsp-shadow);
}

    .gsp-btn-cancel:hover[b-fa8andguwt] {
        background: var(--gsp-surface);
    }

.gsp-btn-save[b-fa8andguwt] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--gsp-accent);
    color: #fff;
    border: none;
    border-radius: var(--gsp-r-md);
    padding: 0.52rem 1.3rem;
    font-size: 0.9rem;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    letter-spacing: .01em;
    box-shadow: 0 2px 10px rgba(194,42,59,.3);
    transition: background .13s, box-shadow .13s, transform .08s;
}

    .gsp-btn-save:hover:not(:disabled)[b-fa8andguwt] {
        background: var(--gsp-accent-dk);
        box-shadow: 0 4px 16px rgba(194,42,59,.4);
        transform: translateY(-1px);
    }

    .gsp-btn-save:active:not(:disabled)[b-fa8andguwt] {
        transform: translateY(0);
    }

    .gsp-btn-save:disabled[b-fa8andguwt] {
        opacity: .6;
        cursor: not-allowed;
    }

    .gsp-btn-save[b-fa8andguwt]  .rzi {
        font-size: 1rem !important;
    }

@keyframes gsp-spin-b-fa8andguwt {
    to {
        transform: rotate(360deg);
    }
}

.gsp-btn-spin[b-fa8andguwt]  .rzi {
    animation: gsp-spin-b-fa8andguwt 1s linear infinite;
}

/* ── Bloque de ubicación ────────────────────────────────── */
.gsp-ubicacion-block[b-fa8andguwt] {
    background: #f8fafc;
    border: 1px solid var(--gsp-border);
    border-radius: var(--gsp-r-md);
    overflow: hidden;
    /* Borde superior de color — se sobreescribe por variante */
    border-top-width: 3px;
}

.gsp-ubicacion-block--origen[b-fa8andguwt] {
    border-top-color: #4f5dff;
}

.gsp-ubicacion-block--destino[b-fa8andguwt] {
    border-top-color: #0d9488;
}

.gsp-ubicacion-header[b-fa8andguwt] {
    /*display: flex;*/
    align-items: flex-start;
    gap: 1rem;
    padding: .75rem 1rem;
    flex-wrap: nowrap; /* ← evita que se rompa en dos líneas */
}

.gsp-ubicacion-label[b-fa8andguwt] {
    display: flex;
    align-items: center;
    padding-top: .55rem;
    flex-shrink: 0; /* ← el badge nunca se encoge */
    min-width: 110px;
}

/* Badge ORIGEN / DESTINO */
.gsp-ubi-badge[b-fa8andguwt] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: .22rem .7rem;
    border-radius: 999px;
    border: 1.5px solid transparent;
}

    .gsp-ubi-badge[b-fa8andguwt]  .rzi {
        font-size: .75rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.gsp-ubi-badge--origen[b-fa8andguwt] {
    background: #eff1ff;
    color: #4f5dff;
    border-color: #c7ccff;
}

.gsp-ubi-badge--destino[b-fa8andguwt] {
    background: #f0fdfa;
    color: #0d9488;
    border-color: #99f6e4;
}

.gsp-ubicacion-select-wrap[b-fa8andguwt] {
    flex: 1;
    min-width: 220px;
}

/* Toggle Ver detalles */
.gsp-ubicacion-toggle[b-fa8andguwt] {
    display: flex;
    align-items: center;
    gap: .3rem;
    width: 100%;
    padding: .4rem 1rem;
    background: transparent;
    border: none;
    border-top: 1px solid var(--gsp-border);
    font-size: .75rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
    transition: background .12s, color .12s;
}

.gsp-ubicacion-block--origen .gsp-ubicacion-toggle[b-fa8andguwt] {
    color: #4f5dff;
}

    .gsp-ubicacion-block--origen .gsp-ubicacion-toggle:hover[b-fa8andguwt] {
        background: rgba(79,93,255,.05);
    }

.gsp-ubicacion-block--destino .gsp-ubicacion-toggle[b-fa8andguwt] {
    color: #0d9488;
}

    .gsp-ubicacion-block--destino .gsp-ubicacion-toggle:hover[b-fa8andguwt] {
        background: rgba(13,148,136,.05);
    }

.gsp-ubicacion-toggle[b-fa8andguwt]  .rzi {
    font-size: .9rem !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

/* Panel de detalles */
.gsp-ubicacion-detail[b-fa8andguwt] {
    border-top: 1px solid var(--gsp-border);
    padding: .75rem 1rem;
    background: #ffffff;
    animation: gsp-slide-down-b-fa8andguwt .15s ease;
}

@keyframes gsp-slide-down-b-fa8andguwt {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.gsp-ubdet-grid[b-fa8andguwt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .5rem .85rem;
}

.gsp-ubdet-item[b-fa8andguwt] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.gsp-ubdet-lbl[b-fa8andguwt] {
    font-size: .65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--gsp-muted);
}

.gsp-ubdet-val[b-fa8andguwt] {
    font-size: .83rem;
    font-weight: 600;
    color: var(--gsp-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Contenedor paralelo Origen / Destino ── */
.gsp-ubi-row[b-fa8andguwt] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    align-items: start; /* cada columna crece solo lo que necesita */
}

.gsp-ubi-col[b-fa8andguwt] {
    min-width: 0; /* evita que el grid se desborde */
}

/* El header dentro del bloque ahora es flex horizontal */
.gsp-ubicacion-header[b-fa8andguwt] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: .75rem 1rem;
    flex-wrap: nowrap;
}

/* El badge ya no necesita min-width fijo en la nueva disposición */
.gsp-ubicacion-label[b-fa8andguwt] {
    flex-shrink: 0;
}

/* El select ocupa el resto del ancho disponible */
.gsp-ubicacion-select-wrap[b-fa8andguwt] {
    flex: 1;
    min-width: 0;
}

/* Los valores de detalle: texto largo → wrap limpio, sin crecer el contenedor */
.gsp-ubdet-val[b-fa8andguwt] {
    white-space: normal; /* permite que rompa línea */
    overflow-wrap: break-word;
    word-break: break-word;
    overflow: hidden;
    text-overflow: unset; /* ya no recorta con "…", muestra todo */
}

/* Grid de detalles: 2 columnas dentro de cada mitad (en lugar de 4) */
.gsp-ubicacion-detail .gsp-ubdet-grid[b-fa8andguwt] {
    grid-template-columns: repeat(2, 1fr);
}

/* Responsive: en pantallas chicas vuelven a apilarse */
@media (max-width: 700px) {
    .gsp-ubi-row[b-fa8andguwt] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .gsp-ubdet-grid[b-fa8andguwt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .gsp-ubicacion-header[b-fa8andguwt] {
        flex-direction: column;
        gap: .5rem;
    }

    .gsp-ubicacion-label[b-fa8andguwt] {
        padding-top: 0;
    }
}

/* ====== Responsive ====== */
@media (max-width: 640px) {
    .gsp-grid-2[b-fa8andguwt], .gsp-grid-3[b-fa8andguwt] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/TorreControl/ModalVistaDocumentosCostos.razor.rz.scp.css */
.mvdc-root[b-qs7s8yr1b6] {
    --tcim-bg: #f4f6fb;
    --tcim-white: #ffffff;
    --tcim-border: #e2e6f0;
    --tcim-navy: #1a2540;
    --tcim-label: #7b8a9b;
    --tcim-accent: #4f5dff;
    --tcim-radius: 10px;
    --tcim-shadow: 0 2px 12px rgba(26,37,64,.07);

    min-width: 360px;
    max-width: 560px;
    padding: .1rem 0 .25rem;
    font-family: inherit;
}

.mvdc-root .tcim-section[b-qs7s8yr1b6] {
    background: var(--tcim-white);
    border: 1px solid var(--tcim-border);
    border-radius: var(--tcim-radius);
    box-shadow: var(--tcim-shadow);
    overflow: hidden;
}

.mvdc-root .tcim-section-hdr[b-qs7s8yr1b6] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .875rem;
    background: #fafbfd;
    border-bottom: 1px solid var(--tcim-border);
}

.mvdc-root .tcim-section-icon[b-qs7s8yr1b6] {
    font-size: 1.05rem !important;
    line-height: 1 !important;
    flex-shrink: 0;
}

.mvdc-root .tcim-section-title[b-qs7s8yr1b6] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--tcim-navy);
}

.mvdc-root .tcim-section-body[b-qs7s8yr1b6] {
    padding: .75rem .875rem;
}

.mvdc-contexto[b-qs7s8yr1b6] {
    margin: 0 0 .65rem;
    font-size: .82rem;
    color: var(--tcim-navy);
    font-weight: 600;
}

.mvdc-loading[b-qs7s8yr1b6] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
    color: var(--tcim-label);
    padding: .5rem 0;
}

.mvdc-vacio[b-qs7s8yr1b6] {
    margin: 0;
    font-size: .82rem;
    color: var(--tcim-label);
}

.mvdc-lista[b-qs7s8yr1b6] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.mvdc-item[b-qs7s8yr1b6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
    padding: .55rem .65rem;
    border: 1px solid var(--tcim-border);
    border-radius: 8px;
    background: #fafbfd;
}

.mvdc-item-info[b-qs7s8yr1b6] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
    flex: 1;
}

.mvdc-tipo[b-qs7s8yr1b6] {
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--tcim-accent);
}

.mvdc-nombre[b-qs7s8yr1b6] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--tcim-navy);
    overflow-wrap: break-word;
    word-break: break-word;
}

.mvdc-fecha[b-qs7s8yr1b6] {
    font-size: .72rem;
    color: var(--tcim-label);
}

.mvdc-item-actions[b-qs7s8yr1b6] {
    display: flex;
    flex-shrink: 0;
    gap: .25rem;
    align-items: center;
}

.mvdc-icon-btn[b-qs7s8yr1b6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
    padding: 0;
    flex-shrink: 0;
}

.mvdc-icon-btn:disabled[b-qs7s8yr1b6] {
    opacity: .45;
    cursor: not-allowed;
}

.mvdc-icon-btn[b-qs7s8yr1b6]  .rzi {
    font-size: .88rem !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

.mvdc-icon-btn--view[b-qs7s8yr1b6] {
    color: #4f5dff;
}

.mvdc-icon-btn--view:hover:not(:disabled)[b-qs7s8yr1b6] {
    background: rgba(79, 93, 255, .1);
    border-color: #4f5dff;
}

.mvdc-icon-btn--del[b-qs7s8yr1b6] {
    color: #c22a3b;
}

.mvdc-icon-btn--del:hover:not(:disabled)[b-qs7s8yr1b6] {
    background: rgba(194, 42, 59, .1);
    border-color: #c22a3b;
}

.mvdc-root .tcim-actions[b-qs7s8yr1b6] {
    display: flex;
    justify-content: flex-end;
    margin-top: .75rem;
    padding: 0 .1rem;
}

.mvdc-root .tcim-btn[b-qs7s8yr1b6] {
    border-radius: 8px;
    padding: .45rem 1rem;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid var(--tcim-border);
    background: var(--tcim-white);
    color: var(--tcim-navy);
}

.mvdc-root .tcim-btn--outline:hover[b-qs7s8yr1b6] {
    border-color: var(--tcim-accent);
    color: var(--tcim-accent);
}

.mvdc-root .tcim-error[b-qs7s8yr1b6] {
    display: flex;
    align-items: flex-start;
    gap: .35rem;
    padding: .5rem .65rem;
    border-radius: 8px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: .8rem;
}

.mvdc-root .tcim-spinner[b-qs7s8yr1b6] {
    width: 1rem;
    height: 1rem;
    border: 2px solid #e2e6f0;
    border-top-color: var(--tcim-accent);
    border-radius: 50%;
    animation: mvdc-spin-b-qs7s8yr1b6 .7s linear infinite;
}

@keyframes mvdc-spin-b-qs7s8yr1b6 {
    to { transform: rotate(360deg); }
}
/* /Pages/TorreControl/SolicitudCxpActualizarModal/SolicitudCxpActualizarModal.razor.rz.scp.css */
.cxp-act-root[b-uhyn9dkkqk] {
    --cxp-act-blue: #1976d2;
    --cxp-act-green: #388e3c;
    --cxp-act-border: #e0e0e0;
    display: flex;
    flex-direction: column;
    min-height: 580px;
    max-height: 90vh;
}

.cxp-act-hdr[b-uhyn9dkkqk] {
    padding: 1rem 1.25rem 0.5rem;
    border-bottom: 1px solid var(--cxp-act-border);
}

.cxp-act-title[b-uhyn9dkkqk] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 600;
}

.cxp-act-sub[b-uhyn9dkkqk] {
    margin: 0.25rem 0 0;
    color: #666;
    font-size: 0.9rem;
}

.cxp-act-body[b-uhyn9dkkqk] {
    flex: 1;
    overflow: auto;
    padding: 1rem 1.25rem;
}

.cxp-act-grid[b-uhyn9dkkqk] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.cxp-act-panel[b-uhyn9dkkqk] {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 240px;
    border: 2px solid var(--cxp-act-border);
    border-radius: 8px;
    padding: 12px;
    background: #fafafa;
    box-sizing: border-box;
}

.cxp-act-panel--left[b-uhyn9dkkqk] {
    border-color: var(--cxp-act-blue);
    background: #f0f7ff;
}

.cxp-act-panel--right[b-uhyn9dkkqk] {
    border-color: var(--cxp-act-green);
    background: #f1f8f1;
}

.cxp-act-panel-title[b-uhyn9dkkqk] {
    text-align: center;
    font-weight: 600;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #ccc;
}

.cxp-act-panel-title--left[b-uhyn9dkkqk] {
    color: #1565c0;
}

.cxp-act-panel-title--right[b-uhyn9dkkqk] {
    color: #2e7d32;
}

.cxp-act-filtros[b-uhyn9dkkqk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

.cxp-act-footer[b-uhyn9dkkqk] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--cxp-act-border);
    background: #fff;
}

.cxp-act-badge[b-uhyn9dkkqk] {
    display: inline-block;
    background: var(--cxp-act-blue);
    color: #fff;
    border-radius: 12px;
    padding: 1px 8px;
    font-size: 0.78rem;
    margin-left: 6px;
}

.cxp-act-badge--green[b-uhyn9dkkqk] {
    background: var(--cxp-act-green);
}

.cxp-act-cell-wrap[b-uhyn9dkkqk] {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.35;
}
/* /Pages/TorreControl/TorreControlCostoDocumentoModal.razor.rz.scp.css */
.tcim-root[b-9qzazy2vyo] {
    --tcim-bg: #f4f6fb;
    --tcim-white: #ffffff;
    --tcim-border: #e2e6f0;
    --tcim-navy: #1a2540;
    --tcim-label: #7b8a9b;
    --tcim-val: #23304d;
    --tcim-accent: #4f5dff;
    --tcim-green: #18b977;
    --tcim-red: #e84040;
    --tcim-radius: 10px;
    --tcim-shadow: 0 2px 12px rgba(26,37,64,.07);

    min-width: 340px;
    max-width: 540px;
    padding: .1rem 0 .25rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    font-family: inherit;
    background: transparent;
}

.tcim-section[b-9qzazy2vyo] {
    background: var(--tcim-white);
    border: 1px solid var(--tcim-border);
    border-radius: var(--tcim-radius);
    box-shadow: var(--tcim-shadow);
    overflow: hidden;
}

.tcim-section-hdr[b-9qzazy2vyo] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .875rem;
    background: #fafbfd;
    border-bottom: 1px solid var(--tcim-border);
}

.tcim-section-icon[b-9qzazy2vyo] {
    font-size: 1.05rem !important;
    line-height: 1 !important;
    flex-shrink: 0;
}

.tcim-section-title[b-9qzazy2vyo] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--tcim-navy);
    flex: 1;
}

.tcim-section-hint[b-9qzazy2vyo] {
    font-size: .65rem;
    color: var(--tcim-label);
    font-weight: 500;
}

.tcim-section-body[b-9qzazy2vyo] {
    padding: .875rem;
}

.tcim-hint[b-9qzazy2vyo] {
    font-size: .8rem;
    color: var(--tcim-label);
    margin: 0 0 .65rem;
}

.tc-drop-zone[b-9qzazy2vyo] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: 1.1rem 1rem;
    border: 1.5px dashed var(--tcim-border);
    border-radius: 10px;
    background: #f8fafc;
    color: var(--tcim-val);
    cursor: pointer;
    text-align: center;
    transition: border-color .15s, background .15s;
}

.tc-drop-zone:hover[b-9qzazy2vyo] {
    border-color: var(--tcim-accent);
    background: #f1f5ff;
}

.tc-drop-zone-icon[b-9qzazy2vyo] {
    font-size: 1.6rem !important;
    color: var(--tcim-accent);
}

.tc-drop-zone-txt[b-9qzazy2vyo] {
    font-size: .85rem;
    font-weight: 600;
    color: var(--tcim-val);
}

.tc-drop-zone-hint[b-9qzazy2vyo] {
    font-size: .7rem;
    color: var(--tcim-label);
    font-weight: 500;
}

.tc-sr-only-input[b-9qzazy2vyo] {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.tcim-error[b-9qzazy2vyo] {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin-top: .6rem;
    padding: .55rem .75rem;
    border-radius: 8px;
    background: #fff0f0;
    border: 1px solid #f7bcbc;
    color: #b91c1c;
    font-size: .8rem;
    line-height: 1.4;
}

.tcim-actions[b-9qzazy2vyo] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: .75rem;
}

.tcim-btn[b-9qzazy2vyo] {
    height: 36px;
    padding: 0 1rem;
    border-radius: 7px;
    font-size: .82rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    border: none;
    transition: background .15s, box-shadow .15s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

.tcim-btn:disabled[b-9qzazy2vyo] {
    opacity: .55;
    cursor: not-allowed;
}

.tcim-btn--primary[b-9qzazy2vyo] {
    background: var(--tcim-accent);
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,93,255,.28);
}

.tcim-btn--primary:hover:not(:disabled)[b-9qzazy2vyo] {
    background: #3f4cdf;
    box-shadow: 0 3px 12px rgba(79,93,255,.38);
}

.tcim-btn--outline[b-9qzazy2vyo] {
    background: var(--tcim-white);
    border: 1.5px solid var(--tcim-border);
    color: var(--tcim-val);
}

.tcim-btn--outline:hover:not(:disabled)[b-9qzazy2vyo] {
    border-color: var(--tcim-accent);
    color: var(--tcim-accent);
}

.tcim-spinner[b-9qzazy2vyo] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    animation: tcimDocSpin-b-9qzazy2vyo .8s linear infinite;
    flex-shrink: 0;
}

@keyframes tcimDocSpin-b-9qzazy2vyo {
    to { transform: rotate(360deg); }
}
/* /Pages/TorreControl/TorreControlDocumentoViajeModal.razor.rz.scp.css */
/* ============================================================
   TorreControlDocumentoViajeModal — mismos tokens y look-and-feel
   que TorreControlIncidenciaViajeModal (estilo del tab Viaje).
   Los estilos están scoped al componente, por eso se replican
   las clases tcim-* aquí.
   ============================================================ */

.tcim-root[b-842n2lsxvl] {
    --tcim-bg: #f4f6fb;
    --tcim-white: #ffffff;
    --tcim-border: #e2e6f0;
    --tcim-navy: #1a2540;
    --tcim-label: #7b8a9b;
    --tcim-val: #23304d;
    --tcim-accent: #4f5dff;
    --tcim-green: #18b977;
    --tcim-red: #e84040;
    --tcim-radius: 10px;
    --tcim-shadow: 0 2px 12px rgba(26,37,64,.07);

    min-width: 340px;
    max-width: 540px;
    padding: .1rem 0 .25rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    font-family: inherit;
    background: transparent;
}

/* ── Sección card ── */
.tcim-section[b-842n2lsxvl] {
    background: var(--tcim-white);
    border: 1px solid var(--tcim-border);
    border-radius: var(--tcim-radius);
    box-shadow: var(--tcim-shadow);
    overflow: hidden;
}

.tcim-section-hdr[b-842n2lsxvl] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .875rem;
    background: #fafbfd;
    border-bottom: 1px solid var(--tcim-border);
}

.tcim-section-icon[b-842n2lsxvl] {
    font-size: 1.05rem !important;
    line-height: 1 !important;
    flex-shrink: 0;
}

.tcim-section-title[b-842n2lsxvl] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--tcim-navy);
    flex: 1;
}

.tcim-section-hint[b-842n2lsxvl] {
    font-size: .65rem;
    color: var(--tcim-label);
    font-weight: 500;
}

.tcim-section-body[b-842n2lsxvl] {
    padding: .875rem;
}

/* ── Drop zone (selector de archivo) ── */
.tc-drop-zone[b-842n2lsxvl] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: 1.1rem 1rem;
    border: 1.5px dashed var(--tcim-border);
    border-radius: 10px;
    background: #f8fafc;
    color: var(--tcim-val);
    cursor: pointer;
    text-align: center;
    transition: border-color .15s, background .15s;
}

    .tc-drop-zone:hover[b-842n2lsxvl] {
        border-color: var(--tcim-accent);
        background: #f1f5ff;
    }

.tc-drop-zone-icon[b-842n2lsxvl] {
    font-size: 1.6rem !important;
    color: var(--tcim-accent);
}

.tc-drop-zone-txt[b-842n2lsxvl] {
    font-size: .85rem;
    font-weight: 600;
    color: var(--tcim-val);
}

.tc-drop-zone-hint[b-842n2lsxvl] {
    font-size: .7rem;
    color: var(--tcim-label);
    font-weight: 500;
}

.tc-sr-only-input[b-842n2lsxvl] {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

/* ── Error ── */
.tcim-error[b-842n2lsxvl] {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin-top: .6rem;
    padding: .55rem .75rem;
    border-radius: 8px;
    background: #fff0f0;
    border: 1px solid #f7bcbc;
    color: #b91c1c;
    font-size: .8rem;
    line-height: 1.4;
}

/* ── Acciones ── */
.tcim-actions[b-842n2lsxvl] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: .75rem;
}

/* ── Botones ── */
.tcim-btn[b-842n2lsxvl] {
    height: 36px;
    padding: 0 1rem;
    border-radius: 7px;
    font-size: .82rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    border: none;
    transition: background .15s, box-shadow .15s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

    .tcim-btn:disabled[b-842n2lsxvl] {
        opacity: .55;
        cursor: not-allowed;
    }

.tcim-btn--primary[b-842n2lsxvl] {
    background: var(--tcim-accent);
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,93,255,.28);
}

    .tcim-btn--primary:hover:not(:disabled)[b-842n2lsxvl] {
        background: #3f4cdf;
        box-shadow: 0 3px 12px rgba(79,93,255,.38);
    }

.tcim-btn--outline[b-842n2lsxvl] {
    background: var(--tcim-white);
    border: 1.5px solid var(--tcim-border);
    color: var(--tcim-val);
}

    .tcim-btn--outline:hover:not(:disabled)[b-842n2lsxvl] {
        border-color: var(--tcim-accent);
        color: var(--tcim-accent);
    }

/* ── Spinner ── */
.tcim-spinner[b-842n2lsxvl] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    animation: tcimDocSpin-b-842n2lsxvl .8s linear infinite;
    flex-shrink: 0;
}

@keyframes tcimDocSpin-b-842n2lsxvl {
    to { transform: rotate(360deg); }
}
/* /Pages/TorreControl/TorreControlIncidenciaViajeModal.razor.rz.scp.css */
/* ============================================================
   TorreControlIncidenciaViajeModal — estilo alineado al tab Viaje
   ============================================================ */

/* ── Variables locales (mismos tokens que TorreControlOrdenDetallePage) ── */
.tcim-root[b-5hlnokkzad] {
    --tcim-bg: #f4f6fb;
    --tcim-white: #ffffff;
    --tcim-border: #e2e6f0;
    --tcim-navy: #1a2540;
    --tcim-label: #7b8a9b;
    --tcim-val: #23304d;
    --tcim-accent: #4f5dff;
    --tcim-green: #18b977;
    --tcim-red: #e84040;
    --tcim-radius: 10px;
    --tcim-shadow: 0 2px 12px rgba(26,37,64,.07);

    min-width: 340px;
    max-width: 520px;
    padding: .1rem 0 .25rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    font-family: inherit;
    background: transparent;
}

/* ── Sección card ── */
.tcim-section[b-5hlnokkzad] {
    background: var(--tcim-white);
    border: 1px solid var(--tcim-border);
    border-radius: var(--tcim-radius);
    box-shadow: var(--tcim-shadow);
    overflow: hidden;
}

.tcim-section-hdr[b-5hlnokkzad] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .875rem;
    background: #fafbfd;
    border-bottom: 1px solid var(--tcim-border);
}

.tcim-section-icon[b-5hlnokkzad] {
    font-size: 1.05rem !important;
    line-height: 1 !important;
    flex-shrink: 0;
}

.tcim-section-title[b-5hlnokkzad] {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--tcim-navy);
    flex: 1;
}

.tcim-section-hint[b-5hlnokkzad] {
    font-size: .65rem;
    color: var(--tcim-label);
    font-weight: 500;
}

.tcim-section-body[b-5hlnokkzad] {
    padding: .875rem;
}

/* ── Upload ── */
.tcim-upload-wrap[b-5hlnokkzad] {
    margin-bottom: .5rem;
}

/* ── Lista de archivos ── */
.tcim-file-list[b-5hlnokkzad] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--tcim-border);
    border-radius: 8px;
    overflow: hidden;
}

.tcim-file-item[b-5hlnokkzad] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .45rem .65rem;
    border-bottom: 1px solid var(--tcim-border);
    font-size: .8rem;
    color: var(--tcim-val);
    background: #f8fafc;
    transition: background .12s;
}

    .tcim-file-item:last-child[b-5hlnokkzad] {
        border-bottom: none;
    }

    .tcim-file-item:hover[b-5hlnokkzad] {
        background: #f1f5f9;
    }

.tcim-file-icon[b-5hlnokkzad] {
    font-size: .95rem !important;
    color: var(--tcim-accent);
    flex-shrink: 0;
}

.tcim-file-name[b-5hlnokkzad] {
    font-size: .8rem;
    color: var(--tcim-val);
    font-weight: 500;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* ── Error ── */
.tcim-error[b-5hlnokkzad] {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin-top: .6rem;
    padding: .55rem .75rem;
    border-radius: 8px;
    background: #fff0f0;
    border: 1px solid #f7bcbc;
    color: #b91c1c;
    font-size: .8rem;
    line-height: 1.4;
}

/* ── Acciones ── */
.tcim-actions[b-5hlnokkzad] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: .75rem;
}

/* ── Botones ── */
.tcim-btn[b-5hlnokkzad] {
    height: 36px;
    padding: 0 1rem;
    border-radius: 7px;
    font-size: .82rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    border: none;
    transition: background .15s, box-shadow .15s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

    .tcim-btn:disabled[b-5hlnokkzad] {
        opacity: .55;
        cursor: not-allowed;
    }

.tcim-btn--primary[b-5hlnokkzad] {
    background: #e84040;
    color: #fff;
    box-shadow: 0 2px 8px rgba(232,64,64,.28);
}

    .tcim-btn--primary:hover:not(:disabled)[b-5hlnokkzad] {
        background: #c42f2f;
        box-shadow: 0 3px 12px rgba(232,64,64,.38);
    }

.tcim-btn--outline[b-5hlnokkzad] {
    background: var(--tcim-white);
    border: 1.5px solid var(--tcim-border);
    color: var(--tcim-val);
}

    .tcim-btn--outline:hover:not(:disabled)[b-5hlnokkzad] {
        border-color: var(--tcim-accent);
        color: var(--tcim-accent);
    }

/* ── Spinner ── */
.tcim-spinner[b-5hlnokkzad] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    animation: tcimSpin-b-5hlnokkzad .8s linear infinite;
    flex-shrink: 0;
}

@keyframes tcimSpin-b-5hlnokkzad {
    to { transform: rotate(360deg); }
}

/* ── Radzen overrides dentro del modal ── */
.tcim-root[b-5hlnokkzad]  .rz-fileupload,
.tcim-root[b-5hlnokkzad]  .rz-fileupload-buttonbar {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.tcim-root[b-5hlnokkzad]  .rz-button.rz-fileupload-choose {
    height: 34px !important;
    padding: 0 .875rem !important;
    border-radius: 7px !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    background: var(--tcim-white) !important;
    border: 1.5px solid var(--tcim-border) !important;
    color: var(--tcim-val) !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: .3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
    width: auto !important;
}

    .tcim-root[b-5hlnokkzad]  .rz-button.rz-fileupload-choose:hover {
        border-color: var(--tcim-accent) !important;
        color: var(--tcim-accent) !important;
    }

.tcim-root[b-5hlnokkzad]  .rz-fileupload-content,
.tcim-root[b-5hlnokkzad]  .rz-fileupload-files,
.tcim-root[b-5hlnokkzad]  .rz-messages,
.tcim-root[b-5hlnokkzad]  .rz-g,
.tcim-root[b-5hlnokkzad]  table,
.tcim-root[b-5hlnokkzad]  .rz-fileupload > *:not(.rz-fileupload-buttonbar) {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* /Pages/TorreControl/TorreControlMercanciaCaptura.razor.rz.scp.css */
.tmc-capture[b-om43ok02mc] {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    --tmc-accent: #d63030;
    --tmc-accent-dk: #b91f2e;
    --tmc-accent-bg: #fff1f1;
    --tmc-border: #eadfd7;
    --tmc-border-md: #d9c7bc;
    --tmc-bg: #fffdfb;
    --tmc-surface: #fff;
    --tmc-text: #13223a;
    --tmc-muted: #7b8aa5;
    --tmc-r-sm: 8px;
    --tmc-r-md: 10px;
    --tmc-r-lg: 14px;
    --tmc-shadow-sm: 0 1px 4px rgba(15,23,42,.05);
}

.tmc-type-row[b-om43ok02mc] {
    max-width: 320px;
}

.tmc-add-row[b-om43ok02mc] {
    display: flex;
    justify-content: flex-end;
}

.tmc-btn-add-cargo[b-om43ok02mc] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--tmc-accent);
    color: #fff;
    border: none;
    border-radius: var(--tmc-r-md);
    padding: 0.55rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(214,48,48,.25);
    transition: background .13s, box-shadow .13s, transform .08s, opacity .12s;
}

.tmc-btn-add-cargo:hover:not(:disabled)[b-om43ok02mc] {
    background: var(--tmc-accent-dk);
    box-shadow: 0 4px 14px rgba(214,48,48,.35);
    transform: translateY(-1px);
}

.tmc-btn-add-cargo:disabled[b-om43ok02mc] {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
}

.tmc-add-ico[b-om43ok02mc]  .rzi {
    font-size: 1rem !important;
}

.tmc-cargo-scroll-area[b-om43ok02mc] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    max-height: min(400px, 38vh);
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    padding-right: 3px;
    flex-shrink: 1;
    scrollbar-width: thin;
    scrollbar-color: var(--tmc-border-md) transparent;
}

.tmc-cargo-scroll-area[b-om43ok02mc]::-webkit-scrollbar {
    width: 4px;
}

.tmc-cargo-scroll-area[b-om43ok02mc]::-webkit-scrollbar-track {
    background: transparent;
}

.tmc-cargo-scroll-area[b-om43ok02mc]::-webkit-scrollbar-thumb {
    background: var(--tmc-border-md);
    border-radius: 999px;
}

.tmc-cargo-card[b-om43ok02mc] {
    background: var(--tmc-surface);
    border: 1px solid var(--tmc-border);
    border-radius: var(--tmc-r-lg);
    overflow: hidden;
    box-shadow: var(--tmc-shadow-sm);
    flex-shrink: 0;
}

.tmc-cargo-card-header[b-om43ok02mc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.55rem 0.85rem;
    border-bottom: 1px solid var(--tmc-border);
    background: var(--tmc-surface);
}

.tmc-cargo-title-row[b-om43ok02mc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tmc-cargo-icon-box[b-om43ok02mc] {
    width: 26px;
    height: 26px;
    border-radius: var(--tmc-r-sm);
    background: var(--tmc-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tmc-cargo-icon-box[b-om43ok02mc]  .rzi {
    font-size: 0.88rem !important;
    color: var(--tmc-accent) !important;
}

.tmc-cargo-title[b-om43ok02mc] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--tmc-text);
}

.tmc-cargo-del-btn[b-om43ok02mc] {
    width: 28px;
    height: 28px;
    border-radius: var(--tmc-r-sm);
    background: transparent;
    border: 1px solid var(--tmc-border);
    color: var(--tmc-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s, opacity .12s;
}

.tmc-cargo-del-btn:hover:not(:disabled)[b-om43ok02mc] {
    background: var(--tmc-accent-bg);
    border-color: #f5c0c0;
    color: var(--tmc-accent);
}

.tmc-cargo-del-btn:disabled[b-om43ok02mc] {
    opacity: .5;
    cursor: not-allowed;
}

.tmc-cargo-del-btn[b-om43ok02mc]  .rzi {
    font-size: 0.95rem !important;
}

.tmc-cargo-grid[b-om43ok02mc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.55rem 0.7rem;
    padding: 0.7rem 0.85rem;
}

.tmc-cargo-check-cell[b-om43ok02mc] {
    min-height: 42px;
    display: flex;
    align-items: center;
    border: 1px solid #d8e0ef;
    padding: 0 0.65rem;
    background: #fff;
}

.tmc-cargo-check-label[b-om43ok02mc] {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #66758f;
    font-weight: 700;
    font-size: .875rem;
}

.tmc-empty-inline[b-om43ok02mc] {
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    background: #f8fafc;
    color: #7b8aa5;
    font-style: italic;
    padding: 0.85rem 1rem;
}

.tmc-capture[b-om43ok02mc]  .rz-form-field .rz-form-field-content {
    min-height: 42px !important;
    border-radius: 0 !important;
    border-color: #d8e0ef !important;
    background: #fff !important;
}

.tmc-capture[b-om43ok02mc]  .rz-inputtext,
.tmc-capture[b-om43ok02mc]  .rz-spinner-input,
.tmc-capture[b-om43ok02mc]  .rz-dropdown {
    font-size: 0.875rem !important;
    color: var(--tmc-text) !important;
}

@media (max-width: 920px) {
    .tmc-cargo-grid[b-om43ok02mc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .tmc-cargo-grid[b-om43ok02mc] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/TorreControl/TorreControlOrdenDetallePage.razor.rz.scp.css */
/* TorreControlOrdenDetallePage — tema oscuro alineado a TorreControlOrdenesPage */

.tc-page.tc-detail[b-c6rxf26w99] {
    --bg: #f5f7fb;
    --white: #ffffff;
    --border: #e2e6f0;
    --text: #23304d;
    --muted: #6d7893;
    --primary: #4f5dff;
    --shadow: 0 2px 10px rgba(28,42,80,.07);
    --r: 14px;
    color: var(--text);
    background: var(--bg);
    /* background: radial-gradient(circle at top right, rgba(196, 42, 59, 0.14), transparent 22%), radial-gradient(circle at bottom left, rgba(207, 178, 122, 0.06), transparent 25%), linear-gradient(180deg, #0c1016, #0f141c 35%, #0b0f14 100%);*/
    padding: 0 0 2rem;
    min-height: 100%;
}

    .tc-detail[b-c6rxf26w99]  .rz-breadcrumb {
        color: var(--muted);
    }

/* ── Breadcrumb ─────────────────────────────────────────── */
.tc-breadcrumb[b-c6rxf26w99] {
    margin: .5rem 0 .5rem;
}

/* ── Títulos ────────────────────────────────────────────── */
.um-title[b-c6rxf26w99] {
    margin: 0 0 .2rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}

.um-subtitle[b-c6rxf26w99] {
    margin: 0 0 1rem;
    color: var(--muted);
    font-size: .95rem;
}

/* ── Header row (title + back btn) ─────────────────────── */
.tc-detail-header[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

/* ── Loader / empty states ──────────────────────────────── */
.um-loader-wrap[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: 2rem 0;
    color: var(--muted);
}

/*.um-state {
    background: linear-gradient(180deg, rgba(25, 31, 41, 0.85), rgba(18, 24, 32, 0.9));
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
}*/
.um-state[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    color: var(--text);
}

/* ── Cards ──────────────────────────────────────────────── */
.um-card[b-c6rxf26w99] {
    /*background: linear-gradient(180deg, rgba(25, 31, 41, 0.92), rgba(18, 24, 32, 0.96));*/
    /*background: rgba(255,255,255,0.02);*/
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    margin-bottom: .7rem;
    transition: box-shadow .15s;
}

    .um-card:hover[b-c6rxf26w99] {
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
    }

/* ── Hero card ──────────────────────────────────────────── */
.tc-hero-card[b-c6rxf26w99] {
    gap: .7rem;
}

.tc-hero-top[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .75rem;
}

.tc-hero-ref-block[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.tc-hero-divider-v[b-c6rxf26w99] {
    width: 1px;
    height: 32px;
    background: var(--border);
    flex-shrink: 0;
}

.tc-hero-alo-val[b-c6rxf26w99] {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--text);
}

.tc-hero-meta-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .85rem 1.25rem;
}

/* ── Divider ────────────────────────────────────────────── */
.um-card-divider[b-c6rxf26w99] {
    height: 1px;
    background: var(--border);
}

/* ── Labels / values ────────────────────────────────────── */
.um-stop-lbl[b-c6rxf26w99] {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    color: var(--muted);
    white-space: nowrap;
    display: block;
    margin-bottom: .18rem;
}

.um-stop-val[b-c6rxf26w99] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

/* ── Chips / badges ─────────────────────────────────────── */
/*.um-chip {
    display: inline-flex;
    align-items: center;
    padding: .18rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
    line-height: 1.5;
}

.um-chip-abierto {
    background: rgba(76, 139, 245, 0.16);
    color: #b9d0ff;
}

.um-chip-proceso {
    background: rgba(209, 139, 44, 0.16);
    color: #ffd496;
}

.um-chip-terminado {
    background: rgba(31, 157, 103, 0.18);
    color: #9bf0c8;
}

.um-chip-cancelado {
    background: rgba(203, 66, 80, 0.16);
    color: #ffadb7;
}

.um-chip-pendiente {
    background: rgba(118, 132, 155, 0.15);
    color: #d6deea;
}

.um-chip-solicitado {
    background: rgba(107, 92, 255, 0.18);
    color: #cfc7ff;
}

.tc-badge {
    display: inline-flex;
    align-items: center;
    padding: .12rem .5rem;
    border-radius: 6px;
    font-size: .75rem;
    font-weight: 700;
}

.tc-badge-ok {
    background: rgba(31, 157, 103, 0.18);
    color: #9bf0c8;
}

.tc-badge-danger {
    background: rgba(203, 66, 80, 0.16);
    color: #ffadb7;
}

.tc-badge-neutral {
    background: rgba(118, 132, 155, 0.15);
    color: #d6deea;
}*/
.um-chip[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    padding: .22rem .75rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
    line-height: 1.5;
    border: 1.5px solid transparent;
}

.um-chip-abierto[b-c6rxf26w99] {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #bfdbfe;
}

.um-chip-proceso[b-c6rxf26w99] {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
}

.um-chip-terminado[b-c6rxf26w99] {
    background: #d1fae5;
    color: #065f46;
    border-color: #a7f3d0;
}

.um-chip-cancelado[b-c6rxf26w99] {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

.um-chip-pendiente[b-c6rxf26w99] {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
}

.um-chip-solicitado[b-c6rxf26w99] {
    background: #ede9fe;
    color: #5b21b6;
    border-color: #ddd6fe;
}

/* ── Badges de tabla ────────────────────────────────────── */
.tc-badge[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    padding: .15rem .55rem;
    border-radius: 6px;
    font-size: .75rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.tc-badge-ok[b-c6rxf26w99] {
    background: #d1fae5;
    color: #065f46;
    border-color: #a7f3d0;
}

.tc-badge-danger[b-c6rxf26w99] {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

.tc-badge-neutral[b-c6rxf26w99] {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
}

/* ═══════════════════════════════════════════════════════
   TABS BAR
   ═══════════════════════════════════════════════════════ */
.tc-tabs-bar[b-c6rxf26w99] {
    display: flex;
    gap: .4rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--border);
    border-radius: var(--r);
    padding: .45rem .6rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow);
    flex-wrap: wrap;
}

.tc-tab-btn[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border: none;
    background: transparent;
    color: var(--muted);
    border-radius: 10px;
    padding: .55rem .95rem;
    font-size: .88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s;
    white-space: nowrap;
}

    .tc-tab-btn:hover[b-c6rxf26w99] {
        background: rgba(255, 255, 255, 0.06);
        color: #fff;
    }

.tc-tab-active[b-c6rxf26w99] {
    background: linear-gradient(90deg, rgba(164, 30, 44, 0.92), rgba(194, 42, 59, 0.92)) !important;
    color: #fff !important;
    font-weight: 700;
}

.tc-tab-btn[b-c6rxf26w99]  .rzi {
    font-size: 1rem !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

/* ═══════════════════════════════════════════════════════
   TABLA DETALLE (Mercancía, Costos, Servicios)
   ═══════════════════════════════════════════════════════ */
.tc-detail-table[b-c6rxf26w99] {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
}

    .tc-detail-table th[b-c6rxf26w99],
    .tc-detail-table td[b-c6rxf26w99] {
        padding: .6rem .85rem;
        border-bottom: 1px solid var(--border);
        text-align: left;
        color: var(--text);
    }

    .tc-detail-table thead th[b-c6rxf26w99] {
        background: rgba(255, 255, 255, 0.03);
        color: var(--muted);
        font-size: .7rem;
        text-transform: uppercase;
        letter-spacing: .04em;
        font-weight: 800;
        white-space: nowrap;
    }

    .tc-detail-table tbody tr:last-child td[b-c6rxf26w99] {
        border-bottom: none;
    }

    .tc-detail-table tbody tr:hover[b-c6rxf26w99] {
        background: rgba(255, 255, 255, 0.04);
    }

.tc-row-num[b-c6rxf26w99] {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 700;
    width: 32px;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   VIAJE — cards grid
   ═══════════════════════════════════════════════════════ */
.tc-viaje-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1rem;
    margin-bottom: .5rem;
}

.tc-viaje-card[b-c6rxf26w99] {
    gap: .65rem;
}

.tc-viaje-header[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.tc-viaje-icon-box[b-c6rxf26w99] {
    width: 36px;
    min-width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(164, 30, 44, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .tc-viaje-icon-box[b-c6rxf26w99]  .rzi {
        font-size: 1.1rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.tc-viaje-meta[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem .85rem;
}

.tc-viaje-meta-item[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

    .tc-viaje-meta-item strong[b-c6rxf26w99] {
        font-size: .88rem;
        color: var(--text);
    }

/* Ruta origen → destino */
.tc-ruta-row[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .5rem .85rem;
    font-size: .85rem;
    font-weight: 600;
}

.tc-ruta-punto[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .3rem;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .tc-ruta-punto[b-c6rxf26w99]  .rzi {
        font-size: .9rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
        flex-shrink: 0;
    }

.tc-ruta-linea[b-c6rxf26w99] {
    flex: 1;
    height: 2px;
    background: var(--border);
    border-radius: 2px;
}

/* Timeline de hitos */
.tc-timeline[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: .5rem;
}

.tc-timeline-item[b-c6rxf26w99] {
    display: flex;
    gap: .75rem;
    position: relative;
    padding-bottom: .85rem;
}

    .tc-timeline-item:last-child[b-c6rxf26w99] {
        padding-bottom: 0;
    }

    .tc-timeline-item[b-c6rxf26w99]::before {
        content: "";
        position: absolute;
        left: 5px;
        top: 14px;
        bottom: 0;
        width: 2px;
        background: var(--border);
    }

    .tc-timeline-item:last-child[b-c6rxf26w99]::before {
        display: none;
    }

.tc-timeline-dot[b-c6rxf26w99] {
    width: 12px;
    min-width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-top: 3px;
    flex-shrink: 0;
}

.tc-dot-done[b-c6rxf26w99] {
    background: #3ca57e;
    box-shadow: 0 0 0 3px #d0f0e4;
}

.tc-dot-pending[b-c6rxf26w99] {
    background: #c0c9dc;
    box-shadow: 0 0 0 3px #edf0f5;
}

.tc-timeline-body[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .06rem;
}

/* ═══════════════════════════════════════════════════════
   FINANZAS
   ═══════════════════════════════════════════════════════ */
.tc-finanzas-layout[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

/* Resumen KPI row */
.tc-fin-summary-row[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .85rem;
    margin-bottom: .35rem;
}

.tc-fin-kpi[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.tc-fin-kpi-val[b-c6rxf26w99] {
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--text);
    line-height: 1.1;
}

.tc-fin-positivo[b-c6rxf26w99] {
    color: #3ca57e !important;
}

.tc-fin-negativo[b-c6rxf26w99] {
    color: #d94b4b !important;
}

/* Section header inside finance cards */
.tc-fin-section-header[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1rem;
    border-bottom: 1px solid var(--border);
    font-weight: 700;
    font-size: .95rem;
    color: var(--text);
}

    .tc-fin-section-header[b-c6rxf26w99]  .rzi {
        font-size: 1rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.tc-fin-count[b-c6rxf26w99] {
    margin-left: auto;
    font-size: .78rem;
    font-weight: 600;
    color: var(--muted);
    background: rgba(255, 255, 255, 0.06);
    border-radius: 999px;
    padding: .1rem .55rem;
}

/* ── Toolbar de mercancías ──────────────────────────────── */
.tc-mercancias-toolbar[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .65rem;
    flex-wrap: wrap;
}

.tc-mercancias-toolbar-left[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.tc-mercancias-toolbar-right[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.tc-mercancias-count[b-c6rxf26w99] {
    font-size: .85rem;
    font-weight: 600;
    color: var(--muted);
}

/* ── Checkbox personalizado ─────────────────────────────── */
.tc-check[b-c6rxf26w99] {
    width: 16px;
    height: 16px;
    accent-color: #c22a3b;
    cursor: pointer;
}

/* ── Fila seleccionada ──────────────────────────────────── */
.tc-row-selected[b-c6rxf26w99] {
    background: rgba(194, 42, 59, 0.06) !important;
}

/* ── Botones de acción por fila ─────────────────────────── */
.tc-row-actions[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
}

.tc-row-btn[b-c6rxf26w99] {
    width: 30px;
    height: 30px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}

    .tc-row-btn[b-c6rxf26w99]  .rzi {
        font-size: .9rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.tc-row-btn-edit[b-c6rxf26w99] {
    color: #4f5dff;
}

    .tc-row-btn-edit:hover[b-c6rxf26w99] {
        background: rgba(79, 93, 255, .12);
        border-color: #4f5dff;
    }

.tc-row-btn-del[b-c6rxf26w99] {
    color: #c22a3b;
}

    .tc-row-btn-del:hover[b-c6rxf26w99] {
        background: rgba(194, 42, 59, .12);
        border-color: #c22a3b;
    }

/* ═══════════════════════════════════════════════════════
   VIAJE EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.tc-viaje-empty[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2.5rem;
    color: var(--text);
}

.tc-viaje-empty-icon[b-c6rxf26w99] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .tc-viaje-empty-icon[b-c6rxf26w99]  .rzi {
        font-size: 1.6rem !important;
        color: var(--muted) !important;
    }

.tc-viaje-empty strong[b-c6rxf26w99] {
    color: var(--text);
}

.tc-viaje-empty p[b-c6rxf26w99] {
    margin: .2rem 0 0;
    color: var(--muted);
    font-size: .9rem;
}

/* ═══════════════════════════════════════════════════════
   VIAJE LAYOUT — 3 columnas
   ═══════════════════════════════════════════════════════ */
.tc-viaje-layout[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 280px 1fr 280px;
    gap: .85rem;
    align-items: start;
}

/* ── Sidebar izquierdo ── */
.tc-viaje-sidebar[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.tc-viaje-sidebar-header[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1rem;
    display: flex;
    align-items: center;
    gap: .65rem;
}

    .tc-viaje-sidebar-header[b-c6rxf26w99]  .rzi {
        font-size: 1.2rem !important;
        color: var(--primary) !important;
    }

.tc-vsb-title[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .95rem;
    color: var(--text);
}

.tc-vsb-sub[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
}

.tc-viaje-list[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.tc-viaje-item[b-c6rxf26w99] {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .75rem .9rem;
    cursor: pointer;
    transition: border-color .14s, box-shadow .14s, background .14s;
}

    .tc-viaje-item:hover[b-c6rxf26w99] {
        border-color: #c22a3b;
        box-shadow: 0 2px 12px rgba(194,42,59,.1);
    }

.tc-viaje-item--active[b-c6rxf26w99] {
    border-color: #c22a3b !important;
    background: #fff8f8 !important;
    box-shadow: 0 2px 14px rgba(194,42,59,.15) !important;
}

.tc-vi-top[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .25rem;
}

.tc-vi-folio[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .92rem;
    color: var(--text);
}

.tc-vi-chip[b-c6rxf26w99] {
    font-size: .65rem !important;
    padding: .12rem .5rem !important;
}

.tc-vi-proveedor[b-c6rxf26w99] {
    font-size: .78rem;
    color: var(--muted);
    margin-bottom: .3rem;
}

.tc-vi-meta[b-c6rxf26w99] {
    display: flex;
    gap: .65rem;
    flex-wrap: wrap;
}

    .tc-vi-meta span[b-c6rxf26w99] {
        display: inline-flex;
        align-items: center;
        gap: .2rem;
        font-size: .75rem;
        color: var(--muted);
        font-weight: 600;
    }

    .tc-vi-meta[b-c6rxf26w99]  .rzi {
        font-size: .8rem !important;
    }

/* Botones de acción sidebar */
.tc-viaje-actions[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin-top: .2rem;
}

.tc-vbtn[b-c6rxf26w99] {
    width: 100%;
    border-radius: 10px;
    padding: .5rem .85rem;
    font-size: .82rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .4rem;
    transition: background .12s, border-color .12s;
}

    .tc-vbtn[b-c6rxf26w99]  .rzi {
        font-size: .9rem !important;
    }

.tc-vbtn-ghost[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    color: var(--text);
}

    .tc-vbtn-ghost:hover[b-c6rxf26w99] {
        background: #f8fafc;
        border-color: #c22a3b;
        color: #c22a3b;
    }

/* ── Columna central: tracking ── */
.tc-viaje-center[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.tc-track-header[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.tc-track-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: 1rem;
    color: var(--text);
}

.tc-track-sub[b-c6rxf26w99] {
    font-size: .78rem;
    color: var(--muted);
    margin-top: .1rem;
}

.tc-track-meta-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .5rem;
}

.tc-track-meta-item[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .7rem .85rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.tc-track-lbl[b-c6rxf26w99] {
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    color: var(--muted);
}

.tc-track-meta-item strong[b-c6rxf26w99] {
    font-size: .88rem;
    color: var(--text);
}

.tc-track-ruta-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.tc-track-ruta-box[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .75rem .9rem;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.tc-track-ruta-val[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}

    .tc-track-ruta-val[b-c6rxf26w99]  .rzi {
        font-size: 1.05rem !important;
        margin-top: .1rem;
        flex-shrink: 0;
    }

    .tc-track-ruta-val strong[b-c6rxf26w99] {
        font-size: .9rem;
        color: var(--text);
        display: block;
    }

    .tc-track-ruta-val span[b-c6rxf26w99] {
        font-size: .75rem;
        color: var(--muted);
        display: block;
    }

/* Visualización de ruta */
.tc-route-visual[b-c6rxf26w99] {
    background: linear-gradient(135deg, #1a2232 0%, #0f1520 100%);
    border: 1px solid #2a3347;
    border-radius: var(--r);
    padding: 1.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 120px;
    position: relative;
    overflow: hidden;
}

    .tc-route-visual[b-c6rxf26w99]::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 30% 50%, rgba(194,42,59,.12) 0%, transparent 60%), radial-gradient(circle at 70% 50%, rgba(79,93,255,.08) 0%, transparent 60%);
        pointer-events: none;
    }

.tc-route-visual-inner[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0;
    position: relative;
    z-index: 1;
}

.tc-rv-point[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    flex-shrink: 0;
    z-index: 2;
}

    .tc-rv-point span[b-c6rxf26w99] {
        font-size: .72rem;
        font-weight: 700;
        color: rgba(255,255,255,.8);
        white-space: nowrap;
        max-width: 90px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.tc-rv-dot[b-c6rxf26w99] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4f5dff;
    box-shadow: 0 0 0 4px rgba(79,93,255,.25);
    flex-shrink: 0;
}

.tc-rv-dot-dest[b-c6rxf26w99] {
    background: #c22a3b;
    box-shadow: 0 0 0 4px rgba(194,42,59,.25);
}

.tc-rv-line[b-c6rxf26w99] {
    flex: 1;
    position: relative;
    height: 3px;
    background: rgba(255,255,255,.1);
    margin: 0 .5rem;
    border-radius: 2px;
}

.tc-rv-line-fill[b-c6rxf26w99] {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 55%;
    background: linear-gradient(90deg, #4f5dff, #c22a3b);
    border-radius: 2px;
}

.tc-rv-truck[b-c6rxf26w99] {
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
    background: #c22a3b;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 4px rgba(194,42,59,.3), 0 2px 8px rgba(0,0,0,.4);
}

    .tc-rv-truck[b-c6rxf26w99]  .rzi {
        font-size: .85rem !important;
        color: #fff !important;
    }

.tc-rv-eta[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    font-weight: 600;
    color: rgba(255,255,255,.65);
    position: relative;
    z-index: 1;
}

    .tc-rv-eta[b-c6rxf26w99]  .rzi {
        font-size: .85rem !important;
    }

/* ── Columna derecha ── */
.tc-viaje-right[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.tc-viaje-right-card[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.tc-vrc-header[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-bottom: .6rem;
    border-bottom: 1px solid var(--border);
}

    .tc-vrc-header[b-c6rxf26w99]  .rzi {
        font-size: 1.1rem !important;
        color: var(--primary) !important;
    }

.tc-vrc-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .92rem;
    color: var(--text);
}

.tc-vrc-sub[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
}

.tc-vrc-empty[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 1rem;
    color: var(--muted);
    font-size: .85rem;
}

/* Timeline v2 */
.tc-timeline-v2[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
    padding-right: .25rem;
}

.tc-tl2-item[b-c6rxf26w99] {
    display: flex;
    gap: .6rem;
}

.tc-tl2-dot-wrap[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    padding-top: .15rem;
}

.tc-tl2-dot[b-c6rxf26w99] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.tc-tl2-dot--done[b-c6rxf26w99] {
    background: #c22a3b;
    box-shadow: 0 0 0 3px rgba(194,42,59,.15);
}

.tc-tl2-dot--pending[b-c6rxf26w99] {
    background: #cbd5e1;
}

.tc-tl2-line[b-c6rxf26w99] {
    width: 2px;
    flex: 1;
    min-height: 16px;
    background: var(--border);
    margin: 3px 0;
}

.tc-tl2-item:last-child .tc-tl2-line[b-c6rxf26w99] {
    display: none;
}

.tc-tl2-body[b-c6rxf26w99] {
    padding-bottom: .8rem;
    flex: 1;
}

.tc-tl2-nombre[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .85rem;
    color: var(--text);
    line-height: 1.2;
}

.tc-tl2-fecha[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
    margin: .1rem 0 .3rem;
}

.tc-tl2-obs[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .25rem;
}

.tc-tl2-badge[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    background: #ede9fe;
    color: #5b21b6;
    font-size: .65rem;
    font-weight: 700;
    padding: .1rem .45rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Solicitud grid */
.tc-sol-grid[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tc-sol-row[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .1rem;
    border-bottom: 1px solid var(--border);
    gap: .5rem;
}

    .tc-sol-row:last-child[b-c6rxf26w99] {
        border-bottom: none;
    }

.tc-sol-lbl[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
    font-weight: 600;
}

.tc-sol-row strong[b-c6rxf26w99] {
    font-size: .85rem;
    color: var(--text);
    text-align: right;
}

/* ── Responsive viaje layout ── */
@media (max-width: 1200px) {
    .tc-viaje-layout[b-c6rxf26w99] {
        grid-template-columns: 240px 1fr 240px;
    }

    .tc-track-meta-grid[b-c6rxf26w99] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .tc-viaje-layout[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }

    .tc-track-ruta-grid[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }
}

/* ── Registro de tiempos (sidebar) ──────────────────────── */
.tc-reg-tiempos[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1rem;
}

.tc-reg-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .88rem;
    color: var(--text);
}

.tc-reg-sub[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .65rem;
}

.tc-reg-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.tc-reg-item[b-c6rxf26w99] {
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .55rem .65rem;
    display: flex;
    flex-direction: column;
    gap: .18rem;
}

.tc-reg-nombre[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .78rem;
    color: var(--text);
}

.tc-reg-fecha[b-c6rxf26w99] {
    font-size: .68rem;
    color: var(--muted);
}

/* ── Histórico solicitudes ───────────────────────────────── */
.tc-hist-list[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.tc-hist-item[b-c6rxf26w99] {
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .55rem .75rem;
}

.tc-hist-top[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .2rem;
}

    .tc-hist-top strong[b-c6rxf26w99] {
        font-size: .85rem;
        color: var(--text);
    }

.tc-hist-sub[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
}

/* ── Tipo en item viaje ──────────────────────────────────── */
.tc-vi-tipo[b-c6rxf26w99] {
    font-size: .73rem;
    color: var(--muted);
    margin-top: .15rem;
}

    .tc-vi-tipo strong[b-c6rxf26w99] {
        color: var(--text);
        font-weight: 700;
    }


/* ── Solicitudes + Trazabilidad sections ──────────────── */
.tc-sol-section[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1.1rem;
    margin-top: .75rem;
}

.tc-sol-section-header[b-c6rxf26w99] {
    margin-bottom: .75rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid var(--border);
}

.tc-sol-section-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .95rem;
    color: var(--text);
}

.tc-sol-section-sub[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
    margin-top: .1rem;
}

/* ── Solicitud cards ─── */
.tc-sol-cards[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.tc-sol-card[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .65rem 1rem;
    flex-wrap: wrap;
}

.tc-sol-card-left[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.tc-sol-card-folio[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .9rem;
    color: var(--text);
}

.tc-sol-card-info[b-c6rxf26w99] {
    font-size: .78rem;
    color: var(--muted);
}

.tc-sol-card-right[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.tc-sol-act-btn[b-c6rxf26w99] {
    border-radius: 8px;
    padding: .3rem .85rem;
    font-size: .8rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background .12s, border-color .12s;
}

.tc-sol-act-accept[b-c6rxf26w99] {
    background: #d1fae5;
    color: #065f46;
    border-color: #a7f3d0;
}

    .tc-sol-act-accept:hover[b-c6rxf26w99] {
        background: #a7f3d0;
        border-color: #6ee7b7;
    }

.tc-sol-act-reject[b-c6rxf26w99] {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

    .tc-sol-act-reject:hover[b-c6rxf26w99] {
        background: #fecaca;
        border-color: #fca5a5;
    }

/* ── Trazabilidad cards ─── */
.tc-traz-cards[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tc-traz-item[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--border);
}

    .tc-traz-item:last-child[b-c6rxf26w99] {
        border-bottom: none;
    }

.tc-traz-dot[b-c6rxf26w99] {
    width: 10px;
    min-width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: .3rem;
    flex-shrink: 0;
}

.tc-traz-dot--viaje[b-c6rxf26w99] {
    background: #c22a3b;
    box-shadow: 0 0 0 3px rgba(194,42,59,.15);
}

.tc-traz-dot--sol[b-c6rxf26w99] {
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245,158,11,.15);
}

.tc-traz-dot--none[b-c6rxf26w99] {
    background: #cbd5e1;
}

.tc-traz-body[b-c6rxf26w99] {
    flex: 1;
    min-width: 0;
}

.tc-traz-nombre[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .88rem;
    color: var(--text);
}

.tc-traz-meta[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
    margin-top: .1rem;
}

/* ── Modal mercancía table ── */
.asv-merc-table-wrap[b-c6rxf26w99] {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: auto;
    margin-bottom: .25rem;
}

/* ── Layout 2 columnas para Solicitudes + Trazabilidad ── */
.tc-bottom-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin-top: .75rem;
}

/* Hace las secciones más compactas */
.tc-sol-section[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .75rem 1rem;
}

.tc-sol-section-header[b-c6rxf26w99] {
    margin-bottom: .55rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--border);
}

.tc-sol-section-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .88rem;
    color: var(--text);
}

.tc-sol-section-sub[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
}

/* Cards de solicitud más compactas */
.tc-sol-card[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .5rem .75rem;
    flex-wrap: wrap;
}

.tc-sol-card-folio[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .85rem;
    color: var(--text);
}

.tc-sol-card-info[b-c6rxf26w99] {
    font-size: .72rem;
    color: var(--muted);
}

.tc-sol-card-right[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
}

/* Botones icono editar/cancelar */
.tc-sol-icon-btn[b-c6rxf26w99] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s;
    flex-shrink: 0;
}

    .tc-sol-icon-btn[b-c6rxf26w99]  .rzi {
        font-size: .85rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.tc-sol-icon-edit[b-c6rxf26w99] {
    color: #4f5dff;
}

    .tc-sol-icon-edit:hover[b-c6rxf26w99] {
        background: rgba(79,93,255,.1);
        border-color: #4f5dff;
    }

.tc-sol-icon-cancel[b-c6rxf26w99] {
    color: #c22a3b;
}

    .tc-sol-icon-cancel:hover[b-c6rxf26w99] {
        background: rgba(194,42,59,.1);
        border-color: #c22a3b;
    }

/* Trazabilidad compacta — items en línea */
.tc-traz-item[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem 0;
    border-bottom: 1px solid var(--border);
}

    .tc-traz-item:last-child[b-c6rxf26w99] {
        border-bottom: none;
    }

.tc-traz-body[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    min-width: 0;
}

.tc-traz-nombre[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .83rem;
    color: var(--text);
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-traz-sep[b-c6rxf26w99] {
    color: var(--muted);
    font-size: .8rem;
}

.tc-traz-meta[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
}

/* ── Paginación ─────────────────────────────────────────── */
.tc-pagination[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .85rem;
    border-top: 1px solid var(--border);
    background: #f8fafc;
}

.tc-pag-info[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
    font-weight: 600;
}

.tc-pag-btns[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.tc-pag-btn[b-c6rxf26w99] {
    min-width: 30px;
    height: 30px;
    padding: 0 .4rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    color: var(--text);
    font-size: .78rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .12s, border-color .12s, color .12s;
}

    .tc-pag-btn:hover:not(:disabled)[b-c6rxf26w99] {
        background: #f1f5f9;
        border-color: #c22a3b;
        color: #c22a3b;
    }

    .tc-pag-btn:disabled[b-c6rxf26w99] {
        opacity: .4;
        cursor: not-allowed;
    }

.tc-pag-btn--active[b-c6rxf26w99] {
    background: #c22a3b !important;
    border-color: #c22a3b !important;
    color: #fff !important;
}

.tc-pag-btn[b-c6rxf26w99]  .rzi {
    font-size: .85rem !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

@media (max-width: 768px) {
    .tc-bottom-grid[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .tc-hero-ref-block[b-c6rxf26w99] {
        flex-direction: column;
        gap: .6rem;
    }

    .tc-hero-divider-v[b-c6rxf26w99] {
        display: none;
    }

    .tc-viaje-meta[b-c6rxf26w99] {
        grid-template-columns: repeat(2, 1fr);
    }

    .tc-fin-summary-row[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }

    .tc-viaje-grid[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }

    .um-stop-val[b-c6rxf26w99] {
        max-width: 100%;
        white-space: normal;
    }
}

@media (max-width: 480px) {
    .tc-page.tc-detail[b-c6rxf26w99] {
        padding: 0 0 1.5rem;
    }

    .um-title[b-c6rxf26w99] {
        font-size: 1.4rem;
    }

    .um-card[b-c6rxf26w99] {
        padding: .8rem .85rem;
    }

    .tc-viaje-meta[b-c6rxf26w99] {
        grid-template-columns: 1fr 1fr;
    }

    .tc-tabs-bar[b-c6rxf26w99] {
        gap: .25rem;
        padding: .3rem .4rem;
    }

    .tc-tab-btn[b-c6rxf26w99] {
        padding: .45rem .7rem;
        font-size: .82rem;
    }
}
/* ============================================================
   TORRE DE CONTROL — Mission Control Aesthetic  |  v4 layout
   ============================================================ */

:root[b-c6rxf26w99] {
    --ct-bg: #f4f6fb;
    --ct-border: #e2e6f0;
    --ct-navy: #1a2540;
    --ct-label: #7b8a9b;
    --ct-val: #23304d;
    --ct-accent: #4f5dff;
    --ct-green: #18b977;
    --ct-green-bg: #e8faf2;
    --ct-green-bdr: #9de8c3;
    --ct-red: #e84040;
    --ct-red-bg: #fff0f0;
    --ct-red-bdr: #f7bcbc;
    --ct-radius: 10px;
    --ct-shadow: 0 2px 12px rgba(26,37,64,.07);
}

.display-zoom[b-c6rxf26w99] {
    zoom: 0.8;
}

/* ── Modal ─────────────────────────────────────────────────── */
.ct-modal[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    background: #f4f6fb;
    min-height: 0;
    height: 100%;
    overflow: hidden; /* desktop: el grid interno maneja el espacio */
}

/* ══════════════════════════════════════════════════════════
   NUEVO LAYOUT — 3 columnas con grid-areas
   Columna 1: izquierda (Transportes + Registro)
   Columna 2: centro (Mapa)
   Columna 3: Timeline (toda la altura)
   Fila inferior: Documentos (col 1 + col 2)
   ══════════════════════════════════════════════════════════ */
.ct-layout[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 320px 1fr 310px;
    grid-template-rows: auto auto;
    grid-template-areas:
        "left center timeline"
        "docs  docs   timeline";
    gap: 0.875rem;
    padding: 0.875rem;
    flex: 1;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

@media (max-width: 1280px) {
    .ct-layout[b-c6rxf26w99] {
        grid-template-columns: minmax(240px, 0.85fr) minmax(0, 1fr) minmax(260px, 310px);
    }
}

@media (max-width: 1200px) {
    .ct-layout[b-c6rxf26w99] {
        grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1fr) 260px;
    }
}

@media (max-width: 992px) {
    .ct-layout[b-c6rxf26w99] {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        grid-template-areas:
            "left"
            "center"
            "timeline"
            "docs";
        overflow-y: auto;
        overflow-x: hidden;
        height: auto;
        min-height: 0;
    }

    .ct-tl-outer[b-c6rxf26w99] {
        max-height: min(480px, 55vh);
    }

    .ct-center-panel[b-c6rxf26w99] {
        min-height: 280px;
    }
}

@media (max-width: 576px) {
    .ct-layout[b-c6rxf26w99] {
        padding: 0.5rem;
        gap: 0.65rem;
    }

    .ct-tl-legend[b-c6rxf26w99] {
        flex-wrap: wrap;
        gap: 0.35rem;
    }
}

/* ════════════════════════════════════════════════════════════
   PANEL IZQUIERDO — col 1, filas 1
   ════════════════════════════════════════════════════════════ */
.ct-left-panel[b-c6rxf26w99] {
    grid-area: left;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    min-height: 0;
    padding-right: 2px;
    /* Sin align-self:start → el panel ocupa la altura de la fila (auto),
       que queda fijada por su propio contenido. El mapa (col 2) se estira
       para igualar esa misma altura de fila. */
}

    .ct-left-panel[b-c6rxf26w99]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-left-panel[b-c6rxf26w99]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

/* ════════════════════════════════════════════════════════════
   PANEL CENTRAL — col 2, fila 1
   align-self: stretch (default) → ocupa toda la altura de la fila,
   que viene determinada por el contenido del panel izquierdo.
   El mapa (flex:1 dentro) se expande para llenar lo que queda tras la action-bar.
   ════════════════════════════════════════════════════════════ */
.ct-center-panel[b-c6rxf26w99] {
    grid-area: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE — col 3, filas 1+2 (toda la altura)
   ════════════════════════════════════════════════════════════ */
.ct-tl-outer[b-c6rxf26w99] {
    grid-area: timeline;
    display: flex;
    flex-direction: column;
    background: #fafbfd;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    min-height: 0;
    overflow: hidden;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS — cols 1+2, fila 2 (abajo)
   max-height reducida: muestra 2-3 filas + scroll
   ════════════════════════════════════════════════════════════ */
.ct-docs-section[b-c6rxf26w99] {
    grid-area: docs;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 195px; /* ≈ header + 3 filas de tabla */
    align-self: start; /* no estira: deja espacio visible entre Registro y Docs */
}

/* Contenedor scrolleable para la grid de archivos guardados */
.ct-docs-scroll-wrap[b-c6rxf26w99] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

    .ct-docs-scroll-wrap[b-c6rxf26w99]::-webkit-scrollbar {
        width: 5px;
    }

    .ct-docs-scroll-wrap[b-c6rxf26w99]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

    .ct-docs-scroll-wrap[b-c6rxf26w99]::-webkit-scrollbar-track {
        background: #f4f6fb;
    }

/* Prompt: sin transporte seleccionado */
.ct-select-prompt[b-c6rxf26w99] {
    grid-column: 2 / 4;
    grid-row: 1 / 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.875rem;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    padding: 2rem;
    text-align: center;
}

/* ════════════════════════════════════════════════════════════
   SECCIÓN GENÉRICA
   ════════════════════════════════════════════════════════════ */
.ct-section[b-c6rxf26w99] {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    overflow: hidden;
}

.ct-section-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fafbfd;
    flex-shrink: 0;
}

.ct-section-title[b-c6rxf26w99] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ba8b8;
    flex: 1;
}

.ct-section-body[b-c6rxf26w99] {
    padding: 0.875rem 1rem;
}

/* ── Transport list ─────────────────────────────────────────── */
.ct-transport-list[b-c6rxf26w99] {
    /* altura fija ≈ 2.5 cards → scroll para el resto */
    height: 195px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.625rem;
}

.ct-transport-list--slots[b-c6rxf26w99] {
    background-image: linear-gradient(rgba(79,93,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(79,93,255,.06) 1px, transparent 1px);
    background-size: 18px 18px;
    background-color: #f6f7fc;
    border-radius: 0 0 10px 10px;
    min-height: 130px;
}

.ct-transport-list[b-c6rxf26w99]::-webkit-scrollbar {
    width: 4px;
}

.ct-transport-list[b-c6rxf26w99]::-webkit-scrollbar-thumb {
    background: #c8d0e0;
    border-radius: 4px;
}

.ct-transport-empty[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1.5rem;
    color: #9ba8b8;
    font-size: 0.8rem;
    font-style: italic;
    width: 100%;
}

/* ── Transport card ─────────────────────────────────────────── */
.ct-transport-card[b-c6rxf26w99] {
    background: #fff;
    border: 1.5px solid #e2e6f0;
    border-radius: 8px;
    padding: 0.55rem 0.875rem; /* más compacto */
    cursor: pointer;
    transition: all 0.18s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(26,37,64,.06);
}

    .ct-transport-card[b-c6rxf26w99]::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: transparent;
        transition: background 0.18s ease;
        border-radius: 3px 0 0 3px;
    }

    .ct-transport-card:hover[b-c6rxf26w99] {
        border-color: #c3caff;
        box-shadow: 0 2px 10px rgba(79,93,255,.12);
        transform: translateX(2px);
    }

.ct-transport-card--active[b-c6rxf26w99] {
    border-color: #4f5dff;
    background: #f5f6ff;
    box-shadow: 0 2px 12px rgba(79,93,255,.14);
}

    .ct-transport-card--active[b-c6rxf26w99]::before {
        background: #4f5dff;
    }

/* S1 — Placas + Tipo chip + Estado badge en la misma fila */
.ct-card-row1[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.28rem;
}

.ct-card-row1-right[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.ct-card-plates[b-c6rxf26w99] {
    font-size: 0.92rem;
    font-weight: 800;
    color: #1a2540;
    letter-spacing: 0.03em;
    line-height: 1.2;
}

/* S2 — Conductor */
.ct-card-driver[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    font-size: 0.74rem;
    font-weight: 600;
    color: #555f70;
    margin-bottom: 0.28rem;
}

.ct-card-driver-icon[b-c6rxf26w99] {
    font-size: 0.8rem !important;
    color: #9ba8b8;
    flex-shrink: 0;
}

/* S3 — Referencia ALO (izq) + Ver detalle (der) en misma línea */
.ct-card-row3[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
}

.ct-card-meta[b-c6rxf26w99] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin-bottom: 0.35rem;
}

.ct-meta-chip[b-c6rxf26w99] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #7b8a9b;
    background: #f1f4f8;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ct-card-ref[b-c6rxf26w99] {
    font-size: 0.73rem;
    font-weight: 600;
    color: #4f5dff;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ct-btn-tracking[b-c6rxf26w99] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.68rem;
    font-weight: 700;
    color: #4f5dff;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .ct-btn-tracking:hover[b-c6rxf26w99] {
        color: #3245e0;
    }

/* ── Status badges ──────────────────────────────────────────── */
.ct-status[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.6rem;
    border-radius: 20px;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ct-status-1[b-c6rxf26w99] {
    background: #1a2540;
    color: #fff;
}

.ct-status-2[b-c6rxf26w99] {
    background: #fff3cd;
    color: #92600a;
    border: 1px solid #fcd34d;
}

.ct-status-3[b-c6rxf26w99] {
    background: #e8faf2;
    color: #0f7a50;
    border: 1px solid #9de8c3;
}

.ct-status-4[b-c6rxf26w99] {
    background: #fff0f0;
    color: #e84040;
    border: 1px solid #f7bcbc;
}

.ct-status-5[b-c6rxf26w99] {
    background: #f1f4f8;
    color: #555f70;
    border: 1px solid #d0d6e0;
}

.ct-status-7[b-c6rxf26w99] {
    background: #edf0ff;
    color: #4f5dff;
    border: 1px solid #c3caff;
}

.ct-status-10[b-c6rxf26w99] {
    background: #fff0e0;
    color: #b45309;
    border: 1px solid #fcd49a;
}

/* ── Form fields ────────────────────────────────────────────── */
.ct-field[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
    margin-bottom: 0.7rem;
}

.ct-lbl[b-c6rxf26w99] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #7b8a9b;
    letter-spacing: 0.03em;
}

.ct-field-row[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.ct-upload-label[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}

/* ══════════════════════════════════════════════════════════
   BOTONES — colores hardcodeados (Blazor scoped CSS no
   resuelve :root vars de forma confiable)
   ══════════════════════════════════════════════════════════ */
.ct-actions[b-c6rxf26w99] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.ct-btn[b-c6rxf26w99] {
    height: 34px;
    padding: 0 0.875rem;
    border-radius: 7px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

.ct-btn--primary[b-c6rxf26w99] {
    background: #4f5dff;
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,93,255,.32);
}

    .ct-btn--primary:hover:not(:disabled)[b-c6rxf26w99] {
        background: #3245e0;
        box-shadow: 0 3px 12px rgba(79,93,255,.42);
    }

    .ct-btn--primary:disabled[b-c6rxf26w99] {
        background: #a5acff;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--outline[b-c6rxf26w99] {
    background: #fff;
    border: 1.5px solid #c8d0e0;
    color: #23304d;
}

    .ct-btn--outline:hover:not(:disabled)[b-c6rxf26w99] {
        border-color: #4f5dff;
        color: #4f5dff;
    }

    .ct-btn--outline:disabled[b-c6rxf26w99] {
        opacity: 0.5;
        cursor: default;
    }

.ct-btn--danger[b-c6rxf26w99] {
    background: #e84040;
    color: #fff;
    box-shadow: 0 2px 8px rgba(232,64,64,.30);
}

    .ct-btn--danger:hover:not(:disabled)[b-c6rxf26w99] {
        background: #c42f2f;
    }

    .ct-btn--danger:disabled[b-c6rxf26w99] {
        background: #f4a0a0;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--fin[b-c6rxf26w99] {
    background: #23304d;
    color: #fff;
    box-shadow: 0 2px 8px rgba(35,48,77,.26);
}

    .ct-btn--fin:hover:not(:disabled)[b-c6rxf26w99] {
        background: #1a2540;
    }

    .ct-btn--fin:disabled[b-c6rxf26w99] {
        background: #7b8a9b;
        box-shadow: none;
        cursor: default;
    }

.ct-divider[b-c6rxf26w99] {
    height: 1px;
    background: #e2e6f0;
    margin: 0.75rem 0;
}

/* ══════════════════════════════════════════════════════════
   RADZEN UPLOAD & SPLITBUTTON
   ══════════════════════════════════════════════════════════ */
.ct-rz-upload .rz-fileupload[b-c6rxf26w99],
.ct-rz-upload .rz-fileupload-buttonbar[b-c6rxf26w99] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.ct-rz-upload .rz-button.rz-fileupload-choose[b-c6rxf26w99] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
}

    .ct-rz-upload .rz-button.rz-fileupload-choose:hover[b-c6rxf26w99] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

.ct-rz-upload--action .rz-button.rz-fileupload-choose[b-c6rxf26w99] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #4f5dff !important;
    color: #4f5dff !important;
    box-shadow: 0 2px 8px rgba(79,93,255,.14) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: background .15s, color .15s !important;
}

    .ct-rz-upload--action .rz-button.rz-fileupload-choose:hover[b-c6rxf26w99] {
        background: #4f5dff !important;
        color: #fff !important;
    }

/* ── Botón compacto "Documento" con ícono clip (panel izquierdo) */
.ct-rz-upload--doc .rz-button.rz-fileupload-choose[b-c6rxf26w99] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #fff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
    width: auto !important;
}

    .ct-rz-upload--doc .rz-button.rz-fileupload-choose:hover[b-c6rxf26w99] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

/* Ocultar lista nativa Radzen en el botón doc */
.ct-rz-upload--doc .rz-fileupload-content[b-c6rxf26w99],
.ct-rz-upload--doc .rz-fileupload-files[b-c6rxf26w99],
.ct-rz-upload--doc .rz-messages[b-c6rxf26w99],
.ct-rz-upload--doc .rz-g[b-c6rxf26w99],
.ct-rz-upload--doc table[b-c6rxf26w99],
.ct-rz-upload--doc .rz-fileupload > *:not(.rz-fileupload-buttonbar)[b-c6rxf26w99] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton)[b-c6rxf26w99] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px 0 0 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #23304d !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(35,48,77,.26) !important;
    transition: background .15s !important;
}

    .ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton):hover[b-c6rxf26w99] {
        background: #1a2540 !important;
    }

.ct-rz-splitbtn .rz-button.rz-splitbutton-menubutton[b-c6rxf26w99] {
    height: 36px !important;
    width: 32px !important;
    border-radius: 0 7px 7px 0 !important;
    background: #1a2540 !important;
    border: none !important;
    border-left: 1px solid rgba(255,255,255,.18) !important;
    color: #fff !important;
}

/* ════════════════════════════════════════════════════════════
   ACTION BAR
   ════════════════════════════════════════════════════════════ */
.ct-action-bar[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════
   MAPA — ocupa todo el alto de la fila 1 (igual que panel izq)
   ════════════════════════════════════════════════════════════ */
.ct-map-wrap[b-c6rxf26w99] {
    position: relative;
    /* flex:1 eliminado — el ct-center-panel es flex-column y el mapa debe
       llenar toda la altura disponible de la fila del grid, que es igual
       a la altura total del panel izquierdo (Transportes + Registro tiempos) */
    flex: 1;
    min-height: 0;
    background: #eef0f7;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
}

#map[b-c6rxf26w99] {
    height: 100%;
    width: 100%;
    min-height: 300px;
}

.ct-map-placeholder[b-c6rxf26w99] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(248,249,253,.93);
    backdrop-filter: blur(2px);
    gap: 0.6rem;
    color: #9ba8b8;
    z-index: 500;
    pointer-events: none;
}

.ct-map-placeholder-icon[b-c6rxf26w99] {
    font-size: 2.8rem;
    opacity: 0.28;
    color: #4f5dff;
}

.ct-map-placeholder-txt[b-c6rxf26w99] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #7b8a9b;
}

.ct-map-placeholder-hint[b-c6rxf26w99] {
    font-size: 0.73rem;
    color: #b0bac9;
    max-width: 220px;
    text-align: center;
    line-height: 1.4;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE
   ════════════════════════════════════════════════════════════ */
/* Timeline header: una sola fila con todos los elementos alineados */
.ct-tl-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fff;
    flex-shrink: 0;
    border-radius: 10px 10px 0 0;
    flex-wrap: nowrap;
    min-width: 0;
    overflow: hidden;
}

.ct-tl-hdr-left[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .3rem;
    flex-shrink: 0;
}

/* El spacer empuja la parte derecha al extremo */
.ct-tl-hdr-left[b-c6rxf26w99]::after {
    content: none;
}

.ct-tl-hdr-right[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex: 1;
    justify-content: flex-end;
    flex-wrap: nowrap;
    min-width: 0;
    overflow: hidden;
}

.ct-tl-hdr-title[b-c6rxf26w99] {
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #475569;
    white-space: nowrap;
}

.ct-tl-legend[b-c6rxf26w99] {
    display: flex;
    gap: 0.35rem;
    flex-shrink: 1;
    flex-wrap: nowrap;
    min-width: 0;
    align-items: center;
}

/* En pantallas donde el timeline se vuelve columna completa, se puede wrap */
@media (max-width: 992px) {
    .ct-tl-hdr[b-c6rxf26w99] {
        flex-wrap: wrap;
    }
    .ct-tl-hdr-right[b-c6rxf26w99] {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.ct-tl-legend-item[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.58rem;
    font-weight: 700;
    color: #7b8a9b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ct-tl-legend-dot[b-c6rxf26w99] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.ct-tl-legend-dot--ctrl[b-c6rxf26w99] {
    background: #18b977;
}

.ct-tl-legend-dot--incident[b-c6rxf26w99] {
    background: #e84040;
}

.ct-tl-scroll[b-c6rxf26w99] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.625rem;
}

    .ct-tl-scroll[b-c6rxf26w99]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-tl-scroll[b-c6rxf26w99]::-webkit-scrollbar-thumb {
        background: #d0d6e0;
        border-radius: 4px;
    }

.ct-tl-empty[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.5rem;
    color: #b0bac9;
    font-size: 0.82rem;
    text-align: center;
    padding: 1.5rem;
}

.ct-tl-list[b-c6rxf26w99] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: 14px;
}

    .ct-tl-list[b-c6rxf26w99]::before {
        content: '';
        position: absolute;
        left: 14px;
        top: 16px;
        bottom: 16px;
        width: 2px;
        background: linear-gradient(to bottom, #18b977 0%, #c3caff 50%, #e84040 100%);
        opacity: 0.3;
        border-radius: 2px;
    }

.ct-tl-item[b-c6rxf26w99] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.35rem 0.35rem 0.35rem 0;
    cursor: pointer;
    border-radius: 7px;
    transition: background 0.15s ease;
    margin-bottom: 2px;
}

    .ct-tl-item:hover[b-c6rxf26w99] {
        background: rgba(79,93,255,.045);
    }

.ct-tl-dot[b-c6rxf26w99] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    transition: transform 0.15s ease;
}

.ct-tl-item:hover .ct-tl-dot[b-c6rxf26w99] {
    transform: scale(1.12);
}

.ct-tl-dot--ctrl[b-c6rxf26w99] {
    background: linear-gradient(135deg, #2dd473, #18b977);
    border: 2px solid #fff;
}

.ct-tl-dot--incident[b-c6rxf26w99] {
    background: linear-gradient(135deg, #ff6b6b, #e84040);
    border: 2px solid #fff;
}

.ct-tl-dot-icon[b-c6rxf26w99] {
    font-size: 0.85rem;
    color: #fff;
}

.ct-tl-dot--pulse[b-c6rxf26w99]::after {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 2px solid currentColor;
    opacity: 0;
    animation: ct-pulse-b-c6rxf26w99 2s infinite;
}

.ct-tl-dot--ctrl.ct-tl-dot--pulse[b-c6rxf26w99] {
    color: #18b977;
}

.ct-tl-dot--incident.ct-tl-dot--pulse[b-c6rxf26w99] {
    color: #e84040;
}

@keyframes ct-pulse-b-c6rxf26w99 {
    0% {
        transform: scale(1);
        opacity: 0.7;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

.ct-tl-card[b-c6rxf26w99] {
    flex: 1;
    min-width: 0;
    padding: 0.4rem 0.55rem;
    border-radius: 7px;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.ct-tl-item--ctrl .ct-tl-card[b-c6rxf26w99] {
    background: #e8faf2;
    border-color: #9de8c3;
}

.ct-tl-item--ctrl:hover .ct-tl-card[b-c6rxf26w99] {
    background: #d1f7e5;
    border-color: #18b977;
}

.ct-tl-item--incident .ct-tl-card[b-c6rxf26w99] {
    background: #fff0f0;
    border-color: #f7bcbc;
}

.ct-tl-item--incident:hover .ct-tl-card[b-c6rxf26w99] {
    background: #ffdede;
    border-color: #e84040;
}

.ct-tl-card-title[b-c6rxf26w99] {
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.3;
    word-break: break-word;
}

.ct-tl-item--ctrl .ct-tl-card-title[b-c6rxf26w99] {
    color: #0a6b41;
}

.ct-tl-item--incident .ct-tl-card-title[b-c6rxf26w99] {
    color: #b02020;
}

.ct-tl-card-date[b-c6rxf26w99] {
    font-size: 0.65rem;
    color: #7b8a9b;
    margin-top: 0.12rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS PENDIENTES
   ════════════════════════════════════════════════════════════ */
.ct-docs-pending[b-c6rxf26w99] {
    padding: 0.75rem 1rem;
    border-top: 1px solid #e2e6f0;
}

.ct-docs-pending-title[b-c6rxf26w99] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #7b8a9b;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

.ct-empty-state[b-c6rxf26w99] {
    padding: 1rem;
    text-align: center;
    color: #9ba8b8;
    font-size: 0.82rem;
    font-style: italic;
}

.ct-select-prompt-icon[b-c6rxf26w99] {
    font-size: 3rem;
    color: #c3caff;
}

.ct-select-prompt-title[b-c6rxf26w99] {
    font-size: 1rem;
    font-weight: 700;
    color: #23304d;
}

.ct-select-prompt-sub[b-c6rxf26w99] {
    font-size: 0.82rem;
    color: #7b8a9b;
    max-width: 280px;
}

.ct-badge[b-c6rxf26w99] {
    background: #4f5dff;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    letter-spacing: 0.03em;
}

.ct-loading[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    color: #7b8a9b;
    font-size: 0.82rem;
}

/* ===== Spinner estilo GenerarSolicitudProveedorModal ===== */
.gsp-spinner[b-c6rxf26w99] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 3px solid var(--gsp-border, #e2e6f0);
    border-top-color: var(--gsp-accent, #c22a3b);
    animation: gspSpin-b-c6rxf26w99 .9s linear infinite;
    flex-shrink: 0;
}

.gsp-spinner--xs[b-c6rxf26w99] {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

.gsp-spinner--sm[b-c6rxf26w99] {
    width: 18px;
    height: 18px;
    border-width: 3px;
}

.gsp-spinner--md[b-c6rxf26w99] {
    width: 28px;
    height: 28px;
    border-width: 3px;
}

@keyframes gspSpin-b-c6rxf26w99 {
    to { transform: rotate(360deg); }
}

/* ── Radzen grid overrides ──────────────────────────────────── */
.ct-modal .rz-grid-table thead th[b-c6rxf26w99] {
    background: #23304d !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
}

.ct-modal .rz-grid-table tbody td[b-c6rxf26w99] {
    font-size: 0.78rem !important;
}

/* Leaflet + mapa Torre Control */
.leaflet-popup-content-wrapper[b-c6rxf26w99],
.leaflet-popup-tip[b-c6rxf26w99] {
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,.15);
}

#tcTorreMap[b-c6rxf26w99] {
    height: 100%;
    width: 100%;
    min-height: 300px;
}

.tc-viaje-mission.ct-modal[b-c6rxf26w99] {
    min-height: 520px;
    border-radius: 12px;
    overflow: hidden;
}

.ct-section--times[b-c6rxf26w99] {
    flex-shrink: 0;
}

/* ── Trazabilidad: contraste legible (Mercancía) ───────────────── */
.tc-traz-meta[b-c6rxf26w99] {
    color: #334155;
    font-weight: 500;
    font-size: .8rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem .35rem;
}

.tc-traz-inline-muted[b-c6rxf26w99] {
    color: #64748b;
    font-weight: 500;
}

.tc-traz-link-btn.rz-button[b-c6rxf26w99] {
    color: #1e3a8a !important;
    font-weight: 700 !important;
    text-decoration: underline;
    text-underline-offset: 2px;
}

    .tc-traz-link-btn.rz-button:hover[b-c6rxf26w99] {
        color: #1d4ed8 !important;
        background: rgba(79, 93, 255, 0.1) !important;
    }

.tc-hitos-rapidos[b-c6rxf26w99] {
    margin-bottom: .5rem;
    padding: .45rem .5rem;
    border-radius: 8px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.tc-hitos-rapidos-lbl[b-c6rxf26w99] {
    display: block;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: .35rem;
}

.tc-hitos-rapidos-row[b-c6rxf26w99] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

/* ── Mapa: barra de acciones + aviso (sin overlay bloqueante) ───── */
.ct-action-bar--map[b-c6rxf26w99] {
    align-items: center;
    margin-bottom: .5rem;
}

.ct-action-bar-spacer[b-c6rxf26w99] {
    flex: 1;
    min-width: .25rem;
}

.ct-meta-chip--strong[b-c6rxf26w99] {
    font-weight: 800;
    color: #0f172a;
    background: #e2e8f0;
    border: 1px solid #cbd5e1;
}

.ct-map-track-hint[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .5rem .65rem;
    margin-bottom: .5rem;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #475569;
    font-size: .8rem;
    line-height: 1.35;
}

.tc-sr-only-input[b-c6rxf26w99] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.tc-plantilla-file-wrap[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    cursor: pointer;
    margin-right: .25rem;
}

/* ── Ruta operativa (estilo compacto tipo UltimaMillaTran) ──────── */
.tc-route-section[b-c6rxf26w99] {
    flex-shrink: 0;
    margin-bottom: .65rem;
    padding: .65rem .75rem;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    background: #fff;
    box-shadow: 0 2px 10px rgba(26, 37, 64, .05);
}

.tc-route-section-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: .55rem;
    padding-bottom: .45rem;
    border-bottom: 1px solid #eef0f7;
}

.tc-route-section-title[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .82rem;
    color: #1a2540;
    flex: 1;
}

.tc-route-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: .5rem;
    align-items: stretch;
}

@media (max-width: 720px) {
    .tc-route-grid[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }

    .tc-route-arrow[b-c6rxf26w99] {
        display: none;
    }
}

.tc-loc-card[b-c6rxf26w99] {
    border-radius: 10px;
    padding: .55rem .65rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    min-height: 72px;
}

.tc-loc-card--origin[b-c6rxf26w99] {
    border-top: 3px solid #22c55e;
}

.tc-loc-card--dest[b-c6rxf26w99] {
    border-top: 3px solid #4f5dff;
}

.tc-loc-badge[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: .35rem;
    color: #64748b;
}

.tc-loc-badge--origin[b-c6rxf26w99] {
    color: #15803d;
}

.tc-loc-badge--dest[b-c6rxf26w99] {
    color: #4338ca;
}

.tc-loc-name[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .84rem;
    color: #0f172a;
    line-height: 1.35;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-route-arrow[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .15rem;
    min-width: 28px;
}

.tc-arrow-line[b-c6rxf26w99] {
    flex: 1;
    width: 2px;
    background: linear-gradient(#e2e8f0, #cbd5e1);
    border-radius: 2px;
    min-height: 8px;
}

.tc-route-meta-row[b-c6rxf26w99] {
    margin-top: .55rem;
}

.tc-loc-meta-val[b-c6rxf26w99] {
    font-weight: 700;
    font-size: .82rem;
    color: #1e293b;
}

/* ════════════════════════════════════════════════════════════
   RUTA FULL (diseño tarjetas con detalles de ubicación)
   ════════════════════════════════════════════════════════════ */
.tc-ruta-full[b-c6rxf26w99] {
    flex-shrink: 0;
    margin-bottom: .65rem;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    background: #fff;
    box-shadow: 0 2px 10px rgba(26,37,64,.05);
    overflow: hidden;
}

.tc-ruta-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .85rem;
    background: #f8fafc;
    border-bottom: 1px solid #eef0f7;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #4f5dff;
}

.tc-ruta-hdr-title[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    color: #4f5dff;
}

.tc-ruta-meta-inline[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .3rem;
    margin-left: auto;
    font-size: .72rem;
    font-weight: 600;
    color: #475569;
    text-transform: none;
    letter-spacing: 0;
}

.tc-ruta-cards-row[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: 1fr 28px 1fr;
    align-items: start;
    padding: .65rem .75rem;
    gap: 0;
}

@media (max-width: 700px) {
    .tc-ruta-cards-row[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }
    .tc-ruta-arrow-sep[b-c6rxf26w99] {
        display: none;
    }
}

.tc-ruta-card[b-c6rxf26w99] {
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    padding: .55rem .7rem;
}

.tc-ruta-card--orig[b-c6rxf26w99] {
    border-top: 3px solid #22c55e;
}

.tc-ruta-card--dest[b-c6rxf26w99] {
    border-top: 3px solid #4f5dff;
}

.tc-ruta-card-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    margin-bottom: .35rem;
    flex-wrap: wrap;
}

.tc-ruta-badge[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: .15rem .45rem;
    border-radius: 20px;
}

.tc-ruta-badge .material-icons[b-c6rxf26w99] {
    font-size: .75rem;
}

.tc-ruta-badge--orig[b-c6rxf26w99] {
    background: #dcfce7;
    color: #15803d;
}

.tc-ruta-badge--dest[b-c6rxf26w99] {
    background: #eef2ff;
    color: #4338ca;
}

.tc-ruta-fecha[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .62rem;
    color: #64748b;
    font-weight: 500;
}

.tc-ruta-fecha .material-icons[b-c6rxf26w99] {
    font-size: .75rem;
}

.tc-ruta-nombre[b-c6rxf26w99] {
    font-weight: 800;
    font-size: .88rem;
    color: #0f172a;
    line-height: 1.3;
    margin-bottom: .45rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-ruta-detalle-tabla[b-c6rxf26w99] {
    width: 100%;
    border-collapse: collapse;
    font-size: .72rem;
}

.tc-ruta-detalle-tabla tr td[b-c6rxf26w99] {
    padding: .08rem .1rem;
    vertical-align: top;
    color: #1e293b;
    line-height: 1.4;
}

.tc-rdt-lbl[b-c6rxf26w99] {
    color: #64748b;
    font-weight: 600;
    white-space: nowrap;
    padding-right: .55rem !important;
    min-width: 70px;
}

.tc-rdt-ref[b-c6rxf26w99] {
    color: #4338ca;
    font-weight: 600;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-ruta-arrow-sep[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1.8rem;
    color: #4f5dff;
}

.tc-ruta-arrow-sep .material-icons[b-c6rxf26w99] {
    font-size: 1.2rem;
}

/* ════════════════════════════════════════════════════════════
   TRACKING PANEL (left column, colapsable)
   ════════════════════════════════════════════════════════════ */
.ct-section--tracking .tc-tracking-hdr[b-c6rxf26w99] {
    background: #f0f4ff;
    border-bottom: 1px solid #d8e0ff;
}

.tc-tracking-body[b-c6rxf26w99] {
    padding: .65rem .75rem .75rem !important;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.tc-tracking-divider-line[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .65rem;
    color: #94a3b8;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: .3rem 0;
}

.tc-tracking-divider-line[b-c6rxf26w99]::before,
.tc-tracking-divider-line[b-c6rxf26w99]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e2e8f0;
}

.ct-map-meta-bar[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .4rem .65rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e2e6f0;
    flex-shrink: 0;
}

.ct-map-hint-inline[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    color: #64748b;
    margin-left: auto;
}

.tc-drop-zone[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    border: 2px dashed #c3caff;
    border-radius: 8px;
    background: #f5f7ff;
    padding: .6rem .75rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    text-align: center;
    position: relative;
    min-height: 70px;
}

.tc-drop-zone:hover[b-c6rxf26w99] {
    border-color: #4f5dff;
    background: #eef2ff;
}

.tc-drop-zone-icon[b-c6rxf26w99] {
    font-size: 1.35rem;
    color: #4f5dff;
    opacity: .85;
}

.tc-drop-zone-txt[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 600;
    color: #334155;
}

.tc-drop-zone-hint[b-c6rxf26w99] {
    font-size: .6rem;
    color: #94a3b8;
    line-height: 1.3;
}

/* ════════════════════════════════════════════════════════════
   BOTÓN INCIDENCIA — responsive
   ≤1440 px: solo icono (sin texto)
   >1440 px: icono + texto (comportamiento normal)
   ════════════════════════════════════════════════════════════ */
.ct-tl-incidencia-wrap[b-c6rxf26w99] {
    display: inline-flex;
    flex-shrink: 0;
}

@media (max-width: 1440px) {
    .ct-tl-incidencia-wrap[b-c6rxf26w99]  .rz-button-text {
        display: none !important;
    }

    .ct-tl-incidencia-wrap[b-c6rxf26w99]  .rz-button {
        min-width: unset !important;
        padding: 0.25rem 0.4rem !important;
    }
}

/* ════════════════════════════════════════════════════════════
   MAP CONTEXT MENU (right-click)
   ════════════════════════════════════════════════════════════ */
.tc-map-ctx-menu[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: .15rem;
    min-width: 200px;
}

.tc-map-ctx-hdr[b-c6rxf26w99] {
    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #475569;
    padding-bottom: .25rem;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: .15rem;
}

.tc-map-ctx-coords[b-c6rxf26w99] {
    font-size: .72rem;
    color: #1e293b;
    font-family: monospace;
    background: #f1f5f9;
    padding: .25rem .4rem;
    border-radius: 4px;
    line-height: 1.4;
}

.tc-map-ctx-btn[b-c6rxf26w99] {
    font-size: .78rem;
    font-weight: 600;
    padding: .4rem .6rem;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    transition: background .15s;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.tc-map-ctx-btn--track[b-c6rxf26w99] {
    background: #4f5dff;
    color: #fff;
}

.tc-map-ctx-btn--track:hover[b-c6rxf26w99] {
    background: #3f4cdf;
}

.tc-map-ctx-btn--incident[b-c6rxf26w99] {
    background: #f59e0b;
    color: #fff;
}

.tc-map-ctx-btn--incident:hover[b-c6rxf26w99] {
    background: #d97706;
}

/* ═══════════════════════════════════════════════════════════════
   FINANZAS — tarjeta principal, tablas, badges, modales
   ═══════════════════════════════════════════════════════════════ */

/* ── Card principal ─────────────────────────────────────────── */
.fin-card[b-c6rxf26w99] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    overflow: hidden;
}

/* ── Header ─────────────────────────────────────────────────── */
.fin-header[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1.25rem .9rem;
    border-bottom: 1px solid var(--border);
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--white);
}

.fin-header-left[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.fin-title[b-c6rxf26w99] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}

.fin-subtitle[b-c6rxf26w99] {
    margin: 0 0 .6rem;
    font-size: .78rem;
    color: var(--muted);
}

/* ── Pill sub-tabs ──────────────────────────────────────────── */
.fin-subtabs[b-c6rxf26w99] {
    display: inline-flex;
    gap: .25rem;
    background: #f1f5f9;
    border: 1px solid var(--border);
    padding: .2rem;
    border-radius: 8px;
}

.finanzas-tab[b-c6rxf26w99] {
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 600;
    padding: .28rem .85rem;
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
    transition: background .12s, color .12s, box-shadow .12s;
    white-space: nowrap;
}

    .finanzas-tab:hover[b-c6rxf26w99] {
        background: #e8edf5;
        color: var(--text);
    }

    .finanzas-tab.active[b-c6rxf26w99] {
        background: #fff;
        color: var(--text);
        font-weight: 700;
        box-shadow: 0 1px 4px rgba(0,0,0,.1);
    }
/* ── Botón agregar ──────────────────────────────────────────── */
.fin-header-actions[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-top: .15rem;
}

.fin-btn-cxp[b-c6rxf26w99] {
    height: 38px;
}

    .fin-btn-cxp[b-c6rxf26w99]  .rz-button {
        height: 38px;
        min-height: 38px;
    }

.fin-th-check[b-c6rxf26w99],
.fin-td-check[b-c6rxf26w99] {
    width: 2.5rem;
    text-align: center;
    vertical-align: middle;
}

.fin-dash[b-c6rxf26w99] {
    color: var(--muted);
    font-size: .9rem;
}

.fin-btn-add[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1.5px solid transparent;
    border-radius: 10px;
    font-size: .85rem;
    font-weight: 600;
    font-family: inherit;
    padding: .45rem 1rem;
    cursor: pointer;
    transition: background .12s, box-shadow .12s, transform .1s;
    white-space: nowrap;
    height: 38px;
}

    .fin-btn-add:active[b-c6rxf26w99] {
        transform: scale(.97);
    }

    .fin-btn-add[b-c6rxf26w99]  .rzi {
        font-size: 1rem !important;
        width: auto !important;
        height: auto !important;
    }

.fin-btn-add--primary[b-c6rxf26w99] {
    background: #c22a3b;
    border-color: #c22a3b;
    color: #fff;
    box-shadow: 0 2px 8px rgba(194,42,59,.28);
}

    .fin-btn-add--primary:hover[b-c6rxf26w99] {
        background: #a8212f;
        box-shadow: 0 4px 14px rgba(194,42,59,.38);
    }

.fin-btn-add--secondary[b-c6rxf26w99] {
    background: var(--white);
    border-color: var(--border);
    color: var(--text);
}

    .fin-btn-add--secondary:hover[b-c6rxf26w99] {
        background: #f8fafc;
        border-color: #c0c9dc;
    }

/* ── Sub-section ────────────────────────────────────────────── */
.fin-section[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
}

.fin-section-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .6rem 1.25rem;
    border-bottom: 1px solid var(--border);
    background: #fafbfd;
}

.fin-section-title[b-c6rxf26w99] {
    font-size: .82rem;
    font-weight: 700;
    color: var(--text);
}

.fin-section-sub[b-c6rxf26w99] {
    font-size: .75rem;
    color: var(--muted);
    flex: 1;
}

.fin-section-count[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 700;
    color: var(--muted);
    background: #e8edf5;
    border-radius: 999px;
    padding: .1rem .55rem;
    min-width: 22px;
    text-align: center;
}

/* ── Empty state ────────────────────────────────────────────── */
.fin-empty[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 2.5rem 1.5rem;
    color: var(--muted);
}

.fin-empty-icon[b-c6rxf26w99] {
    width: 48px;
    min-width: 48px;
    height: 48px;
    background: #f1f5f9;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .fin-empty-icon[b-c6rxf26w99]  .rzi {
        font-size: 1.5rem !important;
        color: var(--muted) !important;
        width: auto !important;
        height: auto !important;
    }

.fin-empty strong[b-c6rxf26w99] {
    display: block;
    font-size: .88rem;
    font-weight: 700;
    color: var(--text);
    margin-bottom: .15rem;
}

.fin-empty p[b-c6rxf26w99] {
    margin: 0;
    font-size: .78rem;
    color: var(--muted);
}

/* ── Tabla ──────────────────────────────────────────────────── */
.fin-table-wrap[b-c6rxf26w99] {
    overflow-x: auto;
}

.fin-table[b-c6rxf26w99] {
    width: 100%;
    border-collapse: collapse;
    font-size: .84rem;
}

    .fin-table th[b-c6rxf26w99] {
        padding: .5rem .85rem;
        text-align: left;
        background: #fafbfd;
        color: var(--muted);
        font-size: .7rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        border-bottom: 1px solid var(--border);
        white-space: nowrap;
    }

    .fin-table td[b-c6rxf26w99] {
        padding: .62rem .85rem;
        border-bottom: 1px solid var(--border);
        color: var(--text);
        vertical-align: middle;
    }

    .fin-table tbody tr:last-child td[b-c6rxf26w99] {
        border-bottom: none;
    }

    .fin-table tbody tr:hover[b-c6rxf26w99] {
        background: #f8fafc;
    }

.fin-th-num[b-c6rxf26w99],
.fin-td-num[b-c6rxf26w99] {
    text-align: right !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.fin-td-clabe[b-c6rxf26w99] {
    font-size: .76rem;
    color: var(--muted);
    white-space: nowrap;
    letter-spacing: .03em;
}

.fin-td-prov[b-c6rxf26w99],
.fin-td-cuenta[b-c6rxf26w99] {
    max-width: 13rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fin-td-nota[b-c6rxf26w99] {
    max-width: 200px;
    white-space: normal;
    font-size: .81rem;
    line-height: 1.4;
}

.fin-th-actions[b-c6rxf26w99],
.fin-table td:last-child[b-c6rxf26w99] {
    text-align: center !important;
    width: 1%;
    white-space: nowrap;
}

/* ── Botones de acción por fila ─────────────────────────────── */
.fin-row-actions[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .25rem;
}

.fin-icon-btn[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
    padding: 0;
    flex-shrink: 0;
}

    .fin-icon-btn[b-c6rxf26w99]  .rzi {
        font-size: .88rem !important;
        width: auto !important;
        height: auto !important;
        line-height: 1 !important;
    }

.fin-icon-btn--edit[b-c6rxf26w99] {
    color: #4f5dff;
}

    .fin-icon-btn--edit:hover[b-c6rxf26w99] {
        background: rgba(79,93,255,.1);
        border-color: #4f5dff;
    }

.fin-icon-btn--del[b-c6rxf26w99] {
    color: #c22a3b;
}

    .fin-icon-btn--del:hover[b-c6rxf26w99] {
        background: rgba(194,42,59,.1);
        border-color: #c22a3b;
    }

.fin-icon-btn--send[b-c6rxf26w99] {
    color: #0284c7;
}

    .fin-icon-btn--send:hover[b-c6rxf26w99] {
        background: rgba(2,132,199,.1);
        border-color: #0284c7;
    }

/* ── Estado badges (pill) ───────────────────────────────────── */
.estado-badge[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    padding: .2rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    white-space: nowrap;
    border: 1.5px solid transparent;
    letter-spacing: .02em;
}

.estado-borrador[b-c6rxf26w99] {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
}

.estado-solicitado[b-c6rxf26w99] {
    background: #fff7ed;
    color: #c2410c;
    border-color: #fed7aa;
}

.estado-facturado[b-c6rxf26w99] {
    background: #d1fae5;
    color: #065f46;
    border-color: #a7f3d0;
}

.estado-cancelado[b-c6rxf26w99] {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

.estado-enviado[b-c6rxf26w99] {
    background: #dbeafe;
    color: #1e40af;
    border-color: #bfdbfe;
}

/* ── Modal ──────────────────────────────────────────────────── */
.fin-overlay[b-c6rxf26w99] {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    backdrop-filter: blur(2px);
}

.fin-modal[b-c6rxf26w99] {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 24px 80px rgba(0,0,0,.22);
    width: 100%;
    max-width: 680px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.fin-modal--narrow[b-c6rxf26w99] {
    max-width: 520px;
}

.fin-modal--wide[b-c6rxf26w99] {
    max-width: min(960px, 98vw);
}

.fin-modal-hdr[b-c6rxf26w99] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    padding: 1.1rem 1.4rem .85rem;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.fin-modal-title[b-c6rxf26w99] {
    margin: 0 0 .12rem;
    font-size: .97rem;
    font-weight: 700;
    color: var(--text);
}

.fin-modal-sub[b-c6rxf26w99] {
    margin: 0;
    font-size: .78rem;
    color: var(--muted);
}

.fin-modal-close[b-c6rxf26w99] {
    width: 32px;
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: #f1f5f9;
    border-radius: 8px;
    font-size: 1.25rem;
    cursor: pointer;
    color: var(--muted);
    transition: background .12s, color .12s;
    line-height: 1;
}

    .fin-modal-close:hover[b-c6rxf26w99] {
        background: #fee2e2;
        color: #c22a3b;
    }

.fin-modal-body[b-c6rxf26w99] {
    padding: 1.1rem 1.4rem;
    overflow-y: auto;
    flex: 1;
}

    .fin-modal-body[b-c6rxf26w99]::-webkit-scrollbar {
        width: 5px;
    }

    .fin-modal-body[b-c6rxf26w99]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

.fin-form-grid[b-c6rxf26w99] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .85rem 1rem;
}

.fin-field[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    min-width: 0;
}

    /* Evitar que el texto del ítem seleccionado en Radzen DropDown desborde la columna */
    .fin-field[b-c6rxf26w99]  .rz-dropdown {
        max-width: 100%;
        min-width: 0;
    }

    .fin-field[b-c6rxf26w99]  .rz-dropdown-label,
    .fin-field[b-c6rxf26w99]  .rz-inputtext {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 100%;
    }

.fin-label[b-c6rxf26w99] {
    font-size: .7rem;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .06em;
}

.fin-field-span2[b-c6rxf26w99] {
    grid-column: span 2;
}

.fin-modal-footer[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
    padding: .85rem 1.4rem;
    border-top: 1px solid var(--border);
    background: #fafbfd;
    flex-shrink: 0;
}

/* Panel lateral: solicitudes de facturación (pestaña Servicios) */
.fin-section--solicitudes-lateral[b-c6rxf26w99] {
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    min-height: 120px;
}

.fin-table-wrap--solicitudes-lateral[b-c6rxf26w99] {
    max-height: min(52vh, 520px);
    overflow-y: auto;
}

.fin-table--compact th[b-c6rxf26w99],
.fin-table--compact td[b-c6rxf26w99] {
    padding: .45rem .55rem;
    font-size: .78rem;
}

.fin-td-wrap[b-c6rxf26w99] {
    max-width: 8rem;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
}

.fin-empty--compact[b-c6rxf26w99] {
    padding: 1.25rem 1rem;
}

/* Modal detalle factura: bitácora y acciones */
.fin-modal--factura-detalle .fin-modal-body[b-c6rxf26w99] {
    padding-top: .85rem;
}

.fin-modal-estado-line[b-c6rxf26w99] {
    margin: .35rem 0 0;
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.fin-modal-section[b-c6rxf26w99] {
    margin-bottom: 1.15rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border);
}

    .fin-modal-section:last-of-type[b-c6rxf26w99] {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

.fin-modal-section-title[b-c6rxf26w99] {
    margin: 0 0 .55rem;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
}

.fin-modal-section--acciones .fin-fact-actions[b-c6rxf26w99] {
    margin-top: .25rem;
}

.fin-modal-section--totales[b-c6rxf26w99] {
    border-bottom: none;
    padding-top: .25rem;
}

.fin-modal-section--cxp-pie[b-c6rxf26w99] {
    border-bottom: none;
    padding-top: .5rem;
}

.fin-cxp-pie-row[b-c6rxf26w99] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-start;
}

.fin-cxp-pie-bitacora[b-c6rxf26w99] {
    flex: 1 1 55%;
    min-width: 280px;
    max-height: min(32vh, 280px);
    overflow-y: auto;
}

.fin-cxp-pie-totales[b-c6rxf26w99] {
    flex: 1 1 35%;
    min-width: 220px;
    display: flex;
    align-items: stretch;
}

.fin-cxp-pie-totales .fin-totals-block[b-c6rxf26w99] {
    margin-left: 0;
    max-width: none;
    width: 100%;
}

@media (max-width: 768px) {
    .fin-cxp-pie-bitacora[b-c6rxf26w99],
    .fin-cxp-pie-totales[b-c6rxf26w99] {
        flex: 1 1 100%;
    }
}

.fin-fact-bitacora[b-c6rxf26w99] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.fin-fact-bitacora-item[b-c6rxf26w99] {
    position: relative;
    padding: .65rem 0 .65rem 1rem;
    border-left: 3px solid #e2e8f0;
    margin-left: .35rem;
}

    .fin-fact-bitacora-item:last-child[b-c6rxf26w99] {
        padding-bottom: 0;
    }

.fin-fact-bitacora-meta[b-c6rxf26w99] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .4rem .65rem;
}

.fin-fact-bitacora-date[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 700;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.fin-fact-bitacora-title[b-c6rxf26w99] {
    font-size: .84rem;
    font-weight: 700;
    color: var(--text);
}

.fin-fact-bitacora-user[b-c6rxf26w99] {
    display: block;
    font-size: .78rem;
    color: #475569;
    margin-top: .15rem;
}

.fin-fact-bitacora-detail[b-c6rxf26w99] {
    margin: .35rem 0 0;
    font-size: .78rem;
    color: var(--text);
    line-height: 1.45;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
}

.fin-fact-actions[b-c6rxf26w99] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.fin-table-wrap--lineas-factura[b-c6rxf26w99] {
    max-height: min(40vh, 360px);
    overflow: auto;
}

.fin-totals-block[b-c6rxf26w99] {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    max-width: 360px;
    margin-left: auto;
}

.fin-totals-row-item[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem 1rem;
    border-bottom: 1px solid var(--border);
    background: #fafbfd;
}

    .fin-totals-row-item:last-child[b-c6rxf26w99] {
        border-bottom: none;
    }

.fin-totals-label[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted);
}

.fin-totals-value[b-c6rxf26w99] {
    font-size: .92rem;
    font-variant-numeric: tabular-nums;
    color: var(--text);
    font-weight: 600;
}

.fin-totals-row-item--total[b-c6rxf26w99] {
    background: #fff;
}

.fin-totals-label--total[b-c6rxf26w99] {
    color: var(--text);
    font-size: .78rem;
}

.fin-totals-value--total[b-c6rxf26w99] {
    font-size: 1.1rem;
    font-weight: 800;
    color: #1a202c;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 600px) {
    .fin-header[b-c6rxf26w99] {
        flex-direction: column;
        align-items: stretch;
    }

    .fin-header-actions[b-c6rxf26w99] {
        justify-content: flex-end;
    }

    .fin-form-grid[b-c6rxf26w99] {
        grid-template-columns: 1fr;
    }

    .fin-field-span2[b-c6rxf26w99] {
        grid-column: span 1;
    }
}

.fin-soporte-ok[b-c6rxf26w99] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .78rem;
    font-weight: 700;
    color: #15803d;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
}

.fin-soporte-ok:hover[b-c6rxf26w99] {
    color: #166534;
    text-decoration: underline;
}

.fin-soporte-no[b-c6rxf26w99] {
    font-size: .78rem;
    color: #94a3b8;
}

.fin-soporte-block[b-c6rxf26w99] {
    margin-top: .5rem;
    padding-top: .75rem;
    border-top: 1px dashed #e2e8f0;
}

.fin-soporte-hint[b-c6rxf26w99] {
    font-size: .78rem;
    color: #64748b;
    margin: 0 0 .5rem;
}

.fin-file-input[b-c6rxf26w99] {
    display: block;
    width: 100%;
    font-size: .8rem;
}

.fin-soporte-lista[b-c6rxf26w99] {
    list-style: none;
    margin: .65rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.fin-soporte-lista li[b-c6rxf26w99] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .4rem .55rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: .8rem;
}

.fin-soporte-guardados[b-c6rxf26w99] {
    margin-top: .75rem;
}

.fin-soporte-guardados-title[b-c6rxf26w99] {
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #64748b;
    margin-bottom: .35rem;
}
/* /Pages/TorreControl/TorreControlOrdenesPage.razor.rz.scp.css */
.tc-page[b-vz2927tysn] {
    --tc-bg: #f6f7fb;
    --tc-surface: #ffffff;
    --tc-surface-soft: #fbfcff;
    --tc-border: #e6e9f1;
    --tc-border-md: #d6dbe7;
    --tc-text: #111827;
    --tc-muted: #687386;
    --tc-subtle: #a1aabc;
    --tc-accent: #d92932;
    --tc-accent-dark: #b81f27;
    --tc-red-soft: #ffe7e8;
    --tc-amber: #d97706;
    --tc-amber-soft: #fff1dc;
    --tc-green: #159467;
    --tc-green-soft: #dcf8ec;
    --tc-blue: #2563eb;
    --tc-blue-soft: #e8f0ff;
    --tc-purple: #7c3aed;
    --tc-purple-soft: #efe8ff;
    --tc-rail: #16875a;
    --tc-rail-soft: #e0f7ec;
    --tc-gray-soft: #f2f4f8;
    --tc-shadow: 0 12px 32px rgba(15, 23, 42, .07);
    --tc-shadow-sm: 0 4px 14px rgba(15, 23, 42, .05);
    background: var(--tc-bg);
    color: var(--tc-text);
    min-height: 100%;
    padding: .7rem 1.2rem 2.5rem;
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;
}

.tc-breadcrumb[b-vz2927tysn] {
    margin: 0 0 .6rem;
}

.tc-page[b-vz2927tysn]  .rz-breadcrumb {
    color: var(--tc-muted);
    font-size: .78rem;
}

.tc-page[b-vz2927tysn]  .rz-breadcrumb-item:last-child {
    color: var(--tc-text);
}

.tc-page-head[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.15rem;
}

.tc-title-block[b-vz2927tysn] {
    min-width: 0;
}

.tc-page-title[b-vz2927tysn] {
    margin: 0 0 .3rem;
    color: var(--tc-text);
    font-size: 1.65rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
}

.tc-page-sub[b-vz2927tysn] {
    margin: 0;
    color: var(--tc-muted);
    font-size: .88rem;
}

.tc-head-actions[b-vz2927tysn],
.tc-monitor-tools[b-vz2927tysn],
.tc-row-actions[b-vz2927tysn] {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.tc-page[b-vz2927tysn]  .tc-btn-primary,
.tc-page[b-vz2927tysn]  .tc-btn-secondary,
.tc-page[b-vz2927tysn]  .tc-btn-action {
    border-radius: 8px !important;
    font-weight: 800 !important;
    box-shadow: var(--tc-shadow-sm) !important;
    white-space: nowrap !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-primary {
    min-height: 42px !important;
    border: 0 !important;
    background: var(--tc-accent) !important;
    color: #fff !important;
    padding: 0 1rem !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-primary:hover {
    background: var(--tc-accent-dark) !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-secondary {
    min-height: 42px !important;
    border: 1px solid var(--tc-border) !important;
    background: #fff !important;
    color: var(--tc-text) !important;
    padding: 0 1rem !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-action {
    min-height: 32px !important;
    height: 32px !important;
    border: 1px solid var(--tc-border) !important;
    background: #fff !important;
    color: var(--tc-text) !important;
    padding: 0 .42rem !important;
    font-size: .7rem !important;
    line-height: 1 !important;
    }

.tc-page[b-vz2927tysn]  .tc-btn-action:hover {
    background: var(--tc-surface-soft) !important;
    border-color: var(--tc-border-md) !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-cancel {
    color: var(--tc-accent) !important;
}

.tc-page[b-vz2927tysn]  .rz-button .rzi {
    font-size: .95rem !important;
}

.tc-page[b-vz2927tysn]  .tc-btn-action .rz-button-text {
    overflow: hidden !important;
    line-height: 1 !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
}

.tc-kpi-grid[b-vz2927tysn] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .9rem;
    margin-bottom: .9rem;
}

.tc-kpi-card[b-vz2927tysn] {
    position: relative;
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr) 96px;
    align-items: center;
    gap: .8rem;
    min-height: 116px;
    padding: 1.05rem;
    overflow: hidden;
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 16px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-kpi-icon[b-vz2927tysn] {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tc-kpi-icon[b-vz2927tysn]  .rzi {
    font-size: 1.4rem !important;
}

.tc-kpi-active .tc-kpi-icon[b-vz2927tysn],
.tc-kpi-alert .tc-kpi-icon[b-vz2927tysn] {
    background: var(--tc-red-soft);
    color: var(--tc-accent);
}

.tc-kpi-process .tc-kpi-icon[b-vz2927tysn] {
    background: var(--tc-amber-soft);
    color: var(--tc-amber);
}

.tc-kpi-done .tc-kpi-icon[b-vz2927tysn] {
    background: var(--tc-green-soft);
    color: var(--tc-green);
}

.tc-kpi-sla .tc-kpi-icon[b-vz2927tysn] {
    background: var(--tc-blue-soft);
    color: var(--tc-blue);
}

.tc-kpi-content[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.tc-kpi-label[b-vz2927tysn] {
    color: var(--tc-text);
    font-size: .78rem;
    font-weight: 800;
}

.tc-kpi-value[b-vz2927tysn] {
    margin-top: .12rem;
    color: var(--tc-text);
    font-size: 1.8rem;
    font-weight: 900;
    line-height: 1.05;
}

.tc-kpi-trend[b-vz2927tysn] {
    margin-top: .35rem;
    font-size: .72rem;
    font-weight: 700;
}

.tc-trend-up[b-vz2927tysn] {
    color: var(--tc-green);
}

.tc-trend-down[b-vz2927tysn] {
    color: var(--tc-accent);
}

.tc-sparkline[b-vz2927tysn] {
    width: 96px;
    height: 36px;
}

.tc-sparkline polyline[b-vz2927tysn] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tc-spark-red polyline[b-vz2927tysn] {
    stroke: var(--tc-accent);
}

.tc-spark-amber polyline[b-vz2927tysn] {
    stroke: #f59f23;
}

.tc-spark-green polyline[b-vz2927tysn] {
    stroke: #29b678;
}

.tc-spark-blue polyline[b-vz2927tysn] {
    stroke: #3f7df4;
}

.tc-filter-card[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-bottom: .9rem;
    padding: 1rem;
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 16px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-filter-row[b-vz2927tysn] {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(130px, .75fr));
    align-items: end;
    gap: .85rem;
}

.tc-filter-row:last-child[b-vz2927tysn] {
    grid-template-columns: minmax(150px, .8fr) minmax(150px, .8fr) minmax(245px, 1fr) auto;
}

.tc-search-wrap[b-vz2927tysn] {
    position: relative;
    min-width: 0;
}

.tc-search-ico[b-vz2927tysn] {
    position: absolute;
    top: 50%;
    left: .85rem;
    z-index: 1;
    transform: translateY(-50%);
    color: var(--tc-muted) !important;
    pointer-events: none;
}

.tc-search-ico[b-vz2927tysn]  .rzi {
    font-size: 1.05rem !important;
}

.tc-page[b-vz2927tysn]  .tc-input-search {
    width: 100% !important;
    min-height: 44px !important;
    padding-left: 2.6rem !important;
    border: 1px solid var(--tc-border) !important;
    border-radius: 8px !important;
    color: var(--tc-text) !important;
    background: #fff !important;
    box-shadow: none !important;
}

.tc-filter-field[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    min-width: 0;
}

.tc-filter-field > span[b-vz2927tysn],
.tc-monitor-tools label > span[b-vz2927tysn] {
    color: var(--tc-text);
    font-size: .72rem;
    font-weight: 800;
}

.tc-page[b-vz2927tysn]  .tc-filter-dropdown,
.tc-page[b-vz2927tysn]  .tc-filter-dropdown .rz-dropdown {
    width: 100%;
    min-height: 44px;
    border-radius: 8px;
}

.tc-select[b-vz2927tysn] {
    width: 100%;
    min-height: 44px;
    padding: .4rem 2.2rem .4rem .85rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-text);
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23687386' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    box-shadow: none;
    appearance: none;
}

.tc-select:focus[b-vz2927tysn],
.tc-date-range:focus[b-vz2927tysn],
.tc-segment:focus[b-vz2927tysn],
.tc-view-btn:focus[b-vz2927tysn] {
    outline: 3px solid rgba(217, 41, 50, .16);
    outline-offset: 0;
}

.tc-date-range[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    min-height: 44px;
    padding: 0 .85rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-text);
    background: #fff;
    font-weight: 700;
    cursor: pointer;
}

.tc-date-range[b-vz2927tysn]  .rzi {
    color: var(--tc-muted);
    font-size: 1rem !important;
}

.tc-date-arrow[b-vz2927tysn] {
    color: var(--tc-subtle);
}

.tc-segmented[b-vz2927tysn] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 44px;
    padding: .18rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    background: #fff;
}

.tc-segment[b-vz2927tysn] {
    height: 36px;
    padding: 0 .9rem;
    border: 0;
    border-radius: 7px;
    color: var(--tc-text);
    background: transparent;
    font-size: .78rem;
    font-weight: 800;
    cursor: pointer;
}

.tc-segment.active[b-vz2927tysn] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-loader[b-vz2927tysn],
.tc-loader-inline[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: 2.2rem 0;
    color: var(--tc-muted);
    font-size: .9rem;
}

.tc-loader-inline[b-vz2927tysn] {
    padding: 1rem 0;
}

.gsp-spinner[b-vz2927tysn] {
    width: 28px;
    height: 28px;
    border: 3px solid #e2e6f0;
    border-top-color: var(--tc-accent);
    border-radius: 999px;
    animation: gspSpin-b-vz2927tysn .9s linear infinite;
    flex-shrink: 0;
}

.gsp-spinner--sm[b-vz2927tysn] {
    width: 18px;
    height: 18px;
}

@keyframes gspSpin-b-vz2927tysn {
    to {
        transform: rotate(360deg);
    }
}

.tc-empty[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-height: 180px;
    padding: 2rem;
    color: var(--tc-muted);
    background: #fff;
    border: 1px solid var(--tc-border);
    border-radius: 16px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-empty-inline[b-vz2927tysn] {
    min-height: 240px;
    margin: 1rem;
    box-shadow: none;
}

.tc-empty strong[b-vz2927tysn] {
    display: block;
    margin-bottom: .25rem;
    color: var(--tc-text);
}

.tc-empty p[b-vz2927tysn] {
    margin: 0;
}

.tc-empty-ico[b-vz2927tysn]  .rzi {
    color: var(--tc-subtle) !important;
    font-size: 2rem !important;
}

.tc-dashboard-layout[b-vz2927tysn] {
    display: grid;
    grid-template-columns: minmax(245px, 21%) minmax(0, 1fr);
    gap: .7rem;
    align-items: start;
}

.tc-side-panels[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .9rem;
    min-width: 0;
}

.tc-panel-card[b-vz2927tysn],
.tc-monitor-card[b-vz2927tysn] {
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 16px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-panel-card[b-vz2927tysn] {
    padding: .85rem;
}

.tc-panel-head[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .65rem;
}

.tc-panel-head h2[b-vz2927tysn],
.tc-monitor-head h2[b-vz2927tysn] {
    margin: 0;
    color: var(--tc-text);
    font-size: .9rem;
    font-weight: 900;
}

.tc-panel-head span[b-vz2927tysn] {
    color: var(--tc-muted);
    font-size: .76rem;
}

.tc-panel-head button[b-vz2927tysn] {
    border: 0;
    color: var(--tc-accent);
    background: transparent;
    font-size: .72rem;
    font-weight: 900;
    cursor: pointer;
}

.tc-alert-list[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
}

.tc-alert-item[b-vz2927tysn] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: .55rem;
    align-items: center;
    min-height: 46px;
    padding: .45rem 0;
    border-bottom: 1px solid var(--tc-border);
}

.tc-alert-item:last-child[b-vz2927tysn] {
    border-bottom: 0;
}

.tc-alert-item strong[b-vz2927tysn],
.tc-alert-item p[b-vz2927tysn] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-alert-item strong[b-vz2927tysn] {
    display: block;
    color: var(--tc-text);
    font-size: .78rem;
    font-weight: 900;
}

.tc-alert-item p[b-vz2927tysn],
.tc-alert-item time[b-vz2927tysn] {
    margin: .12rem 0 0;
    color: var(--tc-muted);
    font-size: .72rem;
}

.tc-alert-icon[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border-radius: 999px;
}

.tc-alert-icon[b-vz2927tysn]  .rzi {
    font-size: 1rem !important;
}

.tc-alert-icon.danger[b-vz2927tysn] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-alert-icon.amber[b-vz2927tysn],
.tc-alert-icon.warning[b-vz2927tysn] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-alert-icon.info[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-donut-wrap[b-vz2927tysn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 106px;
    align-items: center;
    gap: .55rem;
}

.tc-mode-legend[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.tc-mode-legend-row[b-vz2927tysn] {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem;
    color: var(--tc-muted);
    font-size: .72rem;
}

.tc-mode-legend-row strong[b-vz2927tysn] {
    color: var(--tc-text);
}

.tc-dot[b-vz2927tysn] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
}

.tc-dot.maritime[b-vz2927tysn] {
    background: #3367d6;
}

.tc-dot.road[b-vz2927tysn] {
    background: #e22d37;
}

.tc-dot.amber[b-vz2927tysn] {
    background: #f59f23;
}

.tc-dot.green[b-vz2927tysn] {
    background: #29b678;
}

.tc-dot.blue[b-vz2927tysn] {
    background: #3f7df4;
}

.tc-dot.purple[b-vz2927tysn] {
    background: #8b5cf6;
}

.tc-dot.air[b-vz2927tysn] {
    background: #8b5cf6;
}

.tc-dot.rail[b-vz2927tysn] {
    background: #f59f23;
}

.tc-dot.multi[b-vz2927tysn] {
    background: #48c28b;
}

.tc-dot.neutral[b-vz2927tysn] {
    background: #94a3b8;
}

.tc-donut[b-vz2927tysn] {
    position: relative;
    width: 106px;
    height: 106px;
    border-radius: 50%;
}

.tc-donut[b-vz2927tysn]::after {
    content: "";
    position: absolute;
    inset: 20px;
    border-radius: 50%;
    background: #fff;
}

.tc-donut-center[b-vz2927tysn] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tc-donut-center strong[b-vz2927tysn] {
    color: var(--tc-text);
    font-size: 1.25rem;
    font-weight: 900;
}

.tc-donut-center span[b-vz2927tysn] {
    color: var(--tc-muted);
    font-size: .7rem;
}

.tc-trend-chart[b-vz2927tysn] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: 150px auto;
    gap: .3rem .5rem;
}

.tc-trend-axis[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: var(--tc-muted);
    font-size: .7rem;
}

.tc-trend-chart svg[b-vz2927tysn] {
    width: 100%;
    height: 150px;
    overflow: visible;
    background: linear-gradient(to bottom, transparent 24%, #edf0f6 24%, transparent 25%, transparent 49%, #edf0f6 49%, transparent 50%, transparent 74%, #edf0f6 74%, transparent 75%);
}

.tc-trend-chart polyline[b-vz2927tysn] {
    fill: none;
    stroke: var(--tc-accent);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tc-trend-chart circle[b-vz2927tysn] {
    fill: var(--tc-accent);
    stroke: #fff;
    stroke-width: 2;
}

.tc-trend-labels[b-vz2927tysn] {
    grid-column: 2;
    display: flex;
    justify-content: space-between;
    color: var(--tc-muted);
    font-size: .68rem;
}

.tc-monitor-card[b-vz2927tysn] {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: clamp(560px, calc(100vh - 292px), 690px);
}

.tc-monitor-head[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1rem .85rem;
    border-bottom: 1px solid var(--tc-border);
}

.tc-monitor-head > div:first-child[b-vz2927tysn] {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
}

.tc-result-badge[b-vz2927tysn] {
    padding: .25rem .55rem;
    color: var(--tc-muted);
    background: var(--tc-gray-soft);
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 800;
}

.tc-monitor-tools label[b-vz2927tysn] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.tc-select-sort[b-vz2927tysn] {
    min-width: 170px;
    min-height: 38px;
}

.tc-view-btn[b-vz2927tysn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-muted);
    background: #fff;
    cursor: pointer;
}

.tc-view-btn.active[b-vz2927tysn],
.tc-view-btn:hover[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
    border-color: #c9d9ff;
}

.tc-view-btn[b-vz2927tysn]  .rzi {
    font-size: 1.05rem !important;
}

.tc-table-wrap[b-vz2927tysn] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.tc-operation-table[b-vz2927tysn] {
    min-width: 0;
    width: 100%;
}

.tc-table-row[b-vz2927tysn] {
    display: grid;
    grid-template-columns:
        minmax(195px, 1.2fr)
        minmax(170px, 1fr)
        minmax(115px, .72fr)
        72px
        104px
        88px
        minmax(125px, .78fr)
        minmax(135px, .85fr)
        82px
        70px
        230px;
    gap: .62rem;
    align-items: center;
    padding: 0 .75rem;
}

.tc-operation-table--3pl .tc-table-row[b-vz2927tysn] {
    grid-template-columns:
        minmax(185px, 1.05fr)
        minmax(165px, .95fr)
        minmax(120px, .72fr)
        minmax(85px, .55fr)
        minmax(135px, .85fr)
        minmax(130px, .82fr)
        minmax(130px, .82fr)
        minmax(95px, .62fr)
        230px;
}

.tc-table-header[b-vz2927tysn] {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 46px;
    color: var(--tc-muted);
    background: var(--tc-surface-soft);
    border-bottom: 1px solid var(--tc-border);
    font-size: .68rem;
    font-weight: 900;
}

.tc-operation-row[b-vz2927tysn] {
    min-height: 74px;
    border-bottom: 1px solid var(--tc-border);
    transition: background .15s;
}

.tc-operation-row:hover[b-vz2927tysn] {
    background: #fbfcff;
}

.tc-operation-row:last-child[b-vz2927tysn] {
    border-bottom: 0;
}

.tc-operation-row .tc-row-actions[b-vz2927tysn] {
    display: grid;
    grid-template-columns: 54px 68px 92px;
    gap: .34rem;
    align-items: center;
}

.tc-page[b-vz2927tysn]  .tc-operation-row .tc-row-actions .rz-button {
    width: 100% !important;
    min-width: 0 !important;
}

.tc-page[b-vz2927tysn]  .tc-operation-row .tc-row-actions .rz-button-box {
    min-width: 0 !important;
    gap: .22rem !important;
    justify-content: center !important;
}

.tc-page[b-vz2927tysn]  .tc-operation-row .tc-row-actions .rz-button-text {
    flex: 0 1 auto !important;
    min-width: 0 !important;
}

.tc-registro-cell[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.tc-registro-cell strong[b-vz2927tysn] {
    font-size: .76rem;
    font-weight: 800;
    color: var(--tc-text);
}

.tc-subline[b-vz2927tysn] {
    overflow: hidden;
    color: var(--tc-muted);
    font-size: .66rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-grid-meta-wrap--secondary[b-vz2927tysn] {
    padding-top: .1rem;
    border-top: 1px dashed var(--tc-border);
}

.tc-folio-cell[b-vz2927tysn],
.tc-date-cell[b-vz2927tysn],
.tc-transport-cell[b-vz2927tysn],
.tc-route-cell[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .18rem;
    min-width: 0;
}

.tc-folio-cell strong[b-vz2927tysn] {
    color: var(--tc-accent);
    font-size: .77rem;
    font-weight: 900;
}

.tc-folio-cell span[b-vz2927tysn],
.tc-date-cell span[b-vz2927tysn],
.tc-transport-cell span[b-vz2927tysn],
.tc-route-cell span[b-vz2927tysn] {
    color: var(--tc-muted);
    font-size: .69rem;
}

.tc-client-cell[b-vz2927tysn] {
    display: -webkit-box;
    overflow: hidden;
    color: var(--tc-text);
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tc-compact-cell[b-vz2927tysn] {
    overflow: hidden;
    color: var(--tc-text);
    font-size: .74rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-date-cell strong[b-vz2927tysn] {
    color: var(--tc-text);
    font-size: .74rem;
}

.tc-transport-cell span[b-vz2927tysn],
.tc-route-cell span[b-vz2927tysn] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-folio-cell strong[b-vz2927tysn],
.tc-folio-cell span[b-vz2927tysn] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-line-badge[b-vz2927tysn],
.tc-mode-badge[b-vz2927tysn],
.tc-pill[b-vz2927tysn],
.tc-priority[b-vz2927tysn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-height: 25px;
    padding: .22rem .48rem;
    border-radius: 7px;
    font-size: .69rem;
    font-weight: 900;
    white-space: nowrap;
}

.tc-operations-grid[b-vz2927tysn] {
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: .8rem;
    padding: .9rem;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.tc-grid-operation-card[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .7rem;
    min-width: 0;
    padding: .9rem;
    background: #fff;
    border: 1px solid var(--tc-border);
    border-radius: 12px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-grid-operation-card--3pl[b-vz2927tysn] {
    gap: .52rem;
    padding: .78rem;
}

.tc-grid-operation-card header[b-vz2927tysn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.tc-grid-client[b-vz2927tysn] {
    display: -webkit-box;
    overflow: hidden;
    color: var(--tc-text);
    font-size: .82rem;
    font-weight: 900;
    text-transform: uppercase;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tc-grid-badges[b-vz2927tysn] {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.tc-grid-meta[b-vz2927tysn] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.tc-grid-meta-wrap[b-vz2927tysn] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}

.tc-grid-operation-card--3pl .tc-grid-meta-wrap[b-vz2927tysn] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-top: .12rem;
}

.tc-grid-meta span[b-vz2927tysn] {
    color: var(--tc-muted);
    font-size: .68rem;
    font-weight: 800;
}

.tc-grid-meta strong[b-vz2927tysn] {
    overflow: hidden;
    color: var(--tc-text);
    font-size: .76rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-line-badge[b-vz2927tysn] {
    color: var(--tc-muted);
    background: var(--tc-gray-soft);
}

.tc-line-badge.ln-3pl[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-line-badge.ln-sl[b-vz2927tysn] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-mode-badge[b-vz2927tysn] {
    gap: .3rem;
}

.tc-mode-badge[b-vz2927tysn]  .rzi {
    font-size: .9rem !important;
}

.tc-mode-badge.road[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-mode-badge.maritime[b-vz2927tysn] {
    color: #2455c7;
    background: #e5edff;
}

.tc-mode-badge.air[b-vz2927tysn] {
    color: var(--tc-purple);
    background: var(--tc-purple-soft);
}

.tc-mode-badge.rail[b-vz2927tysn] {
    color: var(--tc-rail);
    background: var(--tc-rail-soft);
}

.tc-mode-badge.multi[b-vz2927tysn] {
    color: #6d28d9;
    background: #eee7ff;
}

.tc-pill-neutral[b-vz2927tysn] {
    color: var(--tc-muted);
    background: var(--tc-gray-soft);
}

.tc-pill-open[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-pill-info[b-vz2927tysn] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-pill-warning[b-vz2927tysn] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-pill-pending[b-vz2927tysn] {
    color: #a16207;
    background: #fef3c7;
}

.tc-pill-success[b-vz2927tysn] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-pill-danger[b-vz2927tysn] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-priority.high[b-vz2927tysn] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-priority.medium[b-vz2927tysn] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-priority.low[b-vz2927tysn] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-scroll-sentinel[b-vz2927tysn] {
    height: 1px;
}

.tc-end-hint[b-vz2927tysn] {
    padding: 1rem;
    color: var(--tc-muted);
    text-align: center;
    font-size: .78rem;
}

@media (max-width: 1500px) {
    .tc-kpi-grid[b-vz2927tysn] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tc-filter-row[b-vz2927tysn] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tc-filter-row:last-child[b-vz2927tysn] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tc-operations-grid[b-vz2927tysn] {
        grid-template-columns: repeat(2, minmax(240px, 1fr));
    }
}

@media (max-width: 1180px) {
    .tc-dashboard-layout[b-vz2927tysn] {
        grid-template-columns: 1fr;
    }

    .tc-side-panels[b-vz2927tysn] {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tc-operation-table[b-vz2927tysn] {
        min-width: 1180px;
    }
}

@media (max-width: 900px) {
    .tc-page[b-vz2927tysn] {
        padding: .75rem;
    }

    .tc-page-head[b-vz2927tysn] {
        align-items: flex-start;
        flex-direction: column;
    }

    .tc-head-actions[b-vz2927tysn] {
        width: 100%;
        justify-content: flex-end;
    }

    .tc-kpi-grid[b-vz2927tysn],
    .tc-side-panels[b-vz2927tysn] {
        grid-template-columns: 1fr 1fr;
    }

    .tc-filter-row[b-vz2927tysn],
    .tc-filter-row:last-child[b-vz2927tysn] {
        grid-template-columns: 1fr 1fr;
    }

    .tc-operations-grid[b-vz2927tysn] {
        grid-template-columns: 1fr;
    }

    .tc-monitor-head[b-vz2927tysn] {
        align-items: flex-start;
        flex-direction: column;
    }

    .tc-monitor-tools[b-vz2927tysn] {
        width: 100%;
        flex-wrap: wrap;
    }
}

@media (max-width: 640px) {
    .tc-page-title[b-vz2927tysn] {
        font-size: 1.35rem;
    }

    .tc-head-actions[b-vz2927tysn],
    .tc-monitor-tools[b-vz2927tysn],
    .tc-filter-row[b-vz2927tysn],
    .tc-kpi-grid[b-vz2927tysn],
    .tc-side-panels[b-vz2927tysn] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .tc-kpi-card[b-vz2927tysn] {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .tc-sparkline[b-vz2927tysn] {
        display: none;
    }

    .tc-donut-wrap[b-vz2927tysn] {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .tc-mode-legend[b-vz2927tysn] {
        width: 100%;
    }

    .tc-monitor-tools label[b-vz2927tysn],
    .tc-row-actions[b-vz2927tysn] {
        width: 100%;
    }

    .tc-select-sort[b-vz2927tysn] {
        flex: 1;
    }

    .tc-row-actions[b-vz2927tysn] {
        justify-content: flex-start;
    }
}
/* /Pages/TorreControl/TorreControlRangoFechasModal.razor.rz.scp.css */
.tc-date-modal[b-tnd6xddob1] {
    min-width: 320px;
    max-width: 480px;
    padding: .25rem 0;
}

.tc-date-modal-error[b-tnd6xddob1] {
    margin-top: .5rem;
    color: #b91c1c;
    font-size: .82rem;
}

.tc-date-modal-actions[b-tnd6xddob1] {
    display: flex;
    gap: .5rem;
    justify-content: flex-end;
    margin-top: 1rem;
}
/* /Pages/TorreControl/TorreControlSolicitudesProveedorPage.razor.rz.scp.css */
.tc-page[b-a534odb48t] {
    --tc-bg: #f6f7fb;
    --tc-surface: #ffffff;
    --tc-surface-soft: #fbfcff;
    --tc-border: #e6e9f1;
    --tc-border-md: #d6dbe7;
    --tc-text: #111827;
    --tc-muted: #687386;
    --tc-subtle: #a1aabc;
    --tc-accent: #d92932;
    --tc-accent-dark: #b81f27;
    --tc-red-soft: #ffe7e8;
    --tc-amber: #d97706;
    --tc-amber-soft: #fff1dc;
    --tc-green: #159467;
    --tc-green-soft: #dcf8ec;
    --tc-blue: #2563eb;
    --tc-blue-soft: #e8f0ff;
    --tc-gray-soft: #f2f4f8;
    --tc-shadow: 0 12px 32px rgba(15, 23, 42, .07);
    --tc-shadow-sm: 0 4px 14px rgba(15, 23, 42, .05);
    background: var(--tc-bg);
    color: var(--tc-text);
    min-height: 100%;
    padding: .9rem 1.2rem 2rem;
    font-family: 'DM Sans', 'Nunito', system-ui, sans-serif;
}

.tc-page-head[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.tc-title-block[b-a534odb48t] {
    min-width: 0;
}

.tc-page-title[b-a534odb48t] {
    margin: 0 0 .28rem;
    color: var(--tc-text);
    font-size: 1.55rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.15;
}

.tc-page-sub[b-a534odb48t] {
    margin: 0;
    color: var(--tc-muted);
    font-size: .86rem;
}

.tc-provider-kpis[b-a534odb48t] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .9rem;
    margin-bottom: .85rem;
}

.tc-kpi-card[b-a534odb48t] {
    position: relative;
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr) 92px;
    align-items: center;
    gap: .75rem;
    min-height: 110px;
    padding: 1rem;
    overflow: hidden;
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-kpi-icon[b-a534odb48t] {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tc-kpi-icon[b-a534odb48t]  .rzi {
    font-size: 1.45rem !important;
}

.tc-kpi-pending .tc-kpi-icon[b-a534odb48t],
.tc-kpi-rejected .tc-kpi-icon[b-a534odb48t] {
    background: var(--tc-red-soft);
    color: var(--tc-accent);
}

.tc-kpi-accepted .tc-kpi-icon[b-a534odb48t] {
    background: var(--tc-green-soft);
    color: var(--tc-green);
}

.tc-kpi-build .tc-kpi-icon[b-a534odb48t] {
    background: var(--tc-amber-soft);
    color: var(--tc-amber);
}

.tc-kpi-transit .tc-kpi-icon[b-a534odb48t] {
    background: var(--tc-blue-soft);
    color: var(--tc-blue);
}

.tc-kpi-content[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.tc-kpi-label[b-a534odb48t] {
    color: var(--tc-text);
    font-size: .76rem;
    font-weight: 900;
}

.tc-kpi-value[b-a534odb48t] {
    margin-top: .12rem;
    color: var(--tc-text);
    font-size: 1.8rem;
    font-weight: 900;
    line-height: 1.05;
}

.tc-kpi-trend[b-a534odb48t] {
    margin-top: .32rem;
    font-size: .7rem;
    font-weight: 800;
}

.tc-trend-up[b-a534odb48t] {
    color: var(--tc-green);
}

.tc-trend-down[b-a534odb48t] {
    color: var(--tc-accent);
}

.tc-sparkline[b-a534odb48t] {
    width: 92px;
    height: 36px;
}

.tc-sparkline polyline[b-a534odb48t] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tc-spark-red polyline[b-a534odb48t] {
    stroke: var(--tc-accent);
}

.tc-spark-amber polyline[b-a534odb48t] {
    stroke: #f59f23;
}

.tc-spark-green polyline[b-a534odb48t] {
    stroke: #29b678;
}

.tc-spark-blue polyline[b-a534odb48t] {
    stroke: #3f7df4;
}

.tc-flow-card[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-height: 44px;
    margin-bottom: .85rem;
    padding: .45rem .9rem;
    color: var(--tc-muted);
    background: linear-gradient(90deg, #eff6ff, #f8fbff);
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
    font-size: .78rem;
    font-weight: 800;
}

.tc-flow-card strong[b-a534odb48t] {
    color: var(--tc-text);
}

.tc-flow-card span[b-a534odb48t] {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    color: #40516d;
    white-space: nowrap;
}

.tc-flow-card span[b-a534odb48t]  .rzi,
.tc-flow-info[b-a534odb48t]  .rzi {
    color: var(--tc-blue);
    font-size: 1rem !important;
}

.tc-flow-card i[b-a534odb48t] {
    width: 24px;
    height: 1px;
    background: var(--tc-muted);
}

.tc-flow-card small[b-a534odb48t] {
    color: var(--tc-muted);
    font-size: .72rem;
    font-weight: 600;
}

.tc-filter-card[b-a534odb48t] {
    display: grid;
    grid-template-columns: minmax(240px, 1.35fr) minmax(150px, .75fr) minmax(150px, .75fr) minmax(150px, .75fr) minmax(230px, 1fr) auto;
    align-items: end;
    gap: .85rem;
    margin-bottom: .9rem;
    padding: .85rem;
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-search-wrap[b-a534odb48t] {
    position: relative;
    min-width: 0;
}

.tc-search-ico[b-a534odb48t] {
    position: absolute;
    top: 50%;
    left: .85rem;
    z-index: 1;
    transform: translateY(-50%);
    color: var(--tc-muted) !important;
    pointer-events: none;
}

.tc-search-ico[b-a534odb48t]  .rzi {
    font-size: 1.05rem !important;
}

.tc-page[b-a534odb48t]  .tc-input-search {
    width: 100% !important;
    min-height: 44px !important;
    padding-left: 2.6rem !important;
    border: 1px solid var(--tc-border) !important;
    border-radius: 8px !important;
    color: var(--tc-text) !important;
    background: #fff !important;
    box-shadow: none !important;
}

.tc-filter-field[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    min-width: 0;
}

.tc-filter-field > span[b-a534odb48t],
.tc-monitor-tools label > span[b-a534odb48t] {
    color: var(--tc-text);
    font-size: .72rem;
    font-weight: 900;
}

.tc-select[b-a534odb48t] {
    width: 100%;
    min-height: 44px;
    padding: .4rem 2.2rem .4rem .85rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-text);
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23687386' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    box-shadow: none;
    appearance: none;
    font-size: .78rem;
    font-weight: 800;
}

.tc-date-range[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    min-height: 44px;
    padding: 0 .85rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-text);
    background: #fff;
    font-size: .78rem;
    font-weight: 800;
    cursor: pointer;
}

.tc-date-range[b-a534odb48t]  .rzi {
    color: var(--tc-muted);
    font-size: 1rem !important;
}

.tc-date-arrow[b-a534odb48t] {
    color: var(--tc-subtle);
}

.tc-segmented[b-a534odb48t] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 44px;
    padding: .18rem;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    background: #fff;
}

.tc-segment[b-a534odb48t] {
    height: 36px;
    padding: 0 .75rem;
    border: 0;
    border-radius: 7px;
    color: var(--tc-text);
    background: transparent;
    font-size: .74rem;
    font-weight: 900;
    cursor: pointer;
    white-space: nowrap;
}

.tc-segment.active[b-a534odb48t] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-loader[b-a534odb48t],
.tc-loader-inline[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: 2.2rem 0;
    color: var(--tc-muted);
    font-size: .9rem;
}

.tc-loader-inline[b-a534odb48t] {
    padding: 1rem 0;
}

.gsp-spinner[b-a534odb48t] {
    width: 28px;
    height: 28px;
    border: 3px solid #e2e6f0;
    border-top-color: var(--tc-accent);
    border-radius: 999px;
    animation: gspSpin-b-a534odb48t .9s linear infinite;
    flex-shrink: 0;
}

.gsp-spinner--sm[b-a534odb48t] {
    width: 18px;
    height: 18px;
}

@keyframes gspSpin-b-a534odb48t {
    to {
        transform: rotate(360deg);
    }
}

.tc-empty[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-height: 180px;
    padding: 2rem;
    color: var(--tc-muted);
    background: #fff;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-empty-inline[b-a534odb48t] {
    min-height: 240px;
    margin: 1rem;
    box-shadow: none;
}

.tc-empty strong[b-a534odb48t] {
    display: block;
    margin-bottom: .25rem;
    color: var(--tc-text);
}

.tc-empty p[b-a534odb48t] {
    margin: 0;
}

.tc-empty-ico[b-a534odb48t]  .rzi {
    color: var(--tc-subtle) !important;
    font-size: 2rem !important;
}

.tc-provider-layout[b-a534odb48t] {
    display: grid;
    grid-template-columns: minmax(250px, 22%) minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
}

.tc-side-panels[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
}

.tc-panel-card[b-a534odb48t],
.tc-monitor-card[b-a534odb48t] {
    background: var(--tc-surface);
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-panel-card[b-a534odb48t] {
    padding: .85rem;
}

.tc-panel-head[b-a534odb48t],
.tc-monitor-head[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.tc-panel-head[b-a534odb48t] {
    margin-bottom: .65rem;
}

.tc-panel-head h2[b-a534odb48t],
.tc-monitor-head h2[b-a534odb48t] {
    margin: 0;
    color: var(--tc-text);
    font-size: .9rem;
    font-weight: 900;
}

.tc-panel-head button[b-a534odb48t] {
    border: 0;
    color: var(--tc-accent);
    background: transparent;
    font-size: .72rem;
    font-weight: 900;
    cursor: pointer;
}

.tc-alert-list[b-a534odb48t] {
    display: flex;
    flex-direction: column;
}

.tc-alert-item[b-a534odb48t] {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto 16px;
    gap: .55rem;
    align-items: center;
    min-height: 48px;
    padding: .48rem 0;
    border: 0;
    border-bottom: 1px solid var(--tc-border);
    color: inherit;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.tc-alert-item:last-child[b-a534odb48t] {
    border-bottom: 0;
}

.tc-alert-item strong[b-a534odb48t],
.tc-alert-item p[b-a534odb48t] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-alert-item strong[b-a534odb48t] {
    display: block;
    color: var(--tc-text);
    font-size: .76rem;
    font-weight: 900;
}

.tc-alert-item p[b-a534odb48t] {
    margin: .12rem 0 0;
    color: var(--tc-muted);
    font-size: .7rem;
}

.tc-alert-icon[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    border-radius: 999px;
}

.tc-alert-icon[b-a534odb48t]  .rzi {
    font-size: 1rem !important;
}

.tc-alert-icon.danger[b-a534odb48t] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-alert-icon.warning[b-a534odb48t] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-alert-icon.info[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-alert-icon.success[b-a534odb48t] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-alert-count[b-a534odb48t] {
    min-width: 26px;
    padding: .22rem .45rem;
    border-radius: 7px;
    text-align: center;
    font-size: .72rem;
    font-weight: 900;
}

.tc-alert-count.danger[b-a534odb48t] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-alert-count.warning[b-a534odb48t] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-alert-count.info[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-alert-count.success[b-a534odb48t] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-status-donut-wrap[b-a534odb48t] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 116px;
    align-items: center;
    gap: .65rem;
}

.tc-status-legend[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.tc-status-legend-row[b-a534odb48t] {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    align-items: center;
    gap: .5rem;
    color: var(--tc-muted);
    font-size: .72rem;
}

.tc-status-legend-row strong[b-a534odb48t] {
    color: var(--tc-text);
}

.tc-dot[b-a534odb48t] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
}

.tc-dot.pending[b-a534odb48t],
.tc-dot.rejected[b-a534odb48t] {
    background: var(--tc-accent);
}

.tc-dot.accepted[b-a534odb48t] {
    background: #22c55e;
}

.tc-dot.build[b-a534odb48t] {
    background: #f59e0b;
}

.tc-dot.transit[b-a534odb48t] {
    background: #3b82f6;
}

.tc-donut[b-a534odb48t] {
    position: relative;
    width: 110px;
    height: 110px;
    border-radius: 50%;
}

.tc-donut[b-a534odb48t]::after {
    content: "";
    position: absolute;
    inset: 20px;
    border-radius: 50%;
    background: #fff;
}

.tc-donut-center[b-a534odb48t] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tc-donut-center strong[b-a534odb48t] {
    color: var(--tc-text);
    font-size: 1.25rem;
    font-weight: 900;
}

.tc-donut-center span[b-a534odb48t] {
    color: var(--tc-muted);
    font-size: .7rem;
}

.tc-updated[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
    margin-top: .75rem;
    color: var(--tc-muted);
    font-size: .68rem;
}

.tc-updated button[b-a534odb48t] {
    border: 0;
    color: var(--tc-blue);
    background: transparent;
    cursor: pointer;
}

.tc-monitor-card[b-a534odb48t] {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 610px;
}

.tc-monitor-head[b-a534odb48t] {
    padding: .9rem 1rem .8rem;
    border-bottom: 1px solid var(--tc-border);
}

.tc-monitor-head > div:first-child[b-a534odb48t] {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
}

.tc-result-badge[b-a534odb48t] {
    padding: .25rem .55rem;
    color: var(--tc-muted);
    background: var(--tc-gray-soft);
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 900;
}

.tc-monitor-tools[b-a534odb48t],
.tc-row-actions[b-a534odb48t] {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.tc-row-actions[b-a534odb48t] {
    justify-content: flex-start;
    flex-wrap: wrap;
    min-width: 0;
}

.tc-monitor-tools label[b-a534odb48t] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.tc-select-sort[b-a534odb48t] {
    min-width: 165px;
    min-height: 38px;
}

.tc-view-btn[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    color: var(--tc-muted);
    background: #fff;
    cursor: pointer;
}

.tc-view-btn.active[b-a534odb48t],
.tc-view-btn:hover[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
    border-color: #c9d9ff;
}

.tc-view-btn[b-a534odb48t]  .rzi {
    font-size: 1.05rem !important;
}

.tc-table-wrap[b-a534odb48t] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.tc-provider-table[b-a534odb48t] {
    min-width: 1120px;
    width: 100%;
}

.tc-table-row[b-a534odb48t] {
    display: grid;
    grid-template-columns:
        minmax(150px, 1.05fr)
        minmax(155px, 1fr)
        88px
        92px
        minmax(150px, 1fr)
        minmax(145px, .95fr)
        92px
        95px
        minmax(130px, .9fr)
        minmax(210px, .9fr);
    gap: .55rem;
    align-items: center;
    padding: 0 .75rem;
}

.tc-table-header[b-a534odb48t] {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 46px;
    color: var(--tc-muted);
    background: var(--tc-surface-soft);
    border-bottom: 1px solid var(--tc-border);
    font-size: .66rem;
    font-weight: 900;
}

.tc-provider-row[b-a534odb48t] {
    min-height: 78px;
    border-bottom: 1px solid var(--tc-border);
    transition: background .15s;
}

.tc-provider-row:hover[b-a534odb48t] {
    background: #fbfcff;
}

.tc-folio-cell[b-a534odb48t],
.tc-route-cell[b-a534odb48t],
.tc-service-cell[b-a534odb48t],
.tc-driver-cell[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .18rem;
    min-width: 0;
}

.tc-folio-cell strong[b-a534odb48t] {
    overflow: hidden;
    color: var(--tc-text);
    font-size: .78rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-folio-cell span[b-a534odb48t],
.tc-route-cell span[b-a534odb48t],
.tc-service-cell span[b-a534odb48t],
.tc-driver-cell span[b-a534odb48t] {
    overflow: hidden;
    color: var(--tc-muted);
    font-size: .68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-client-cell[b-a534odb48t] {
    display: -webkit-box;
    overflow: hidden;
    color: var(--tc-text);
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tc-service-cell strong[b-a534odb48t],
.tc-driver-cell strong[b-a534odb48t] {
    overflow: hidden;
    color: var(--tc-text);
    font-size: .72rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-danger-text[b-a534odb48t] {
    color: var(--tc-accent) !important;
}

.tc-line-badge[b-a534odb48t],
.tc-type-badge[b-a534odb48t],
.tc-pill[b-a534odb48t],
.tc-viaje-badge[b-a534odb48t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-height: 25px;
    padding: .22rem .48rem;
    border-radius: 7px;
    font-size: .68rem;
    font-weight: 900;
    white-space: nowrap;
}

.tc-line-badge[b-a534odb48t] {
    color: var(--tc-muted);
    background: var(--tc-gray-soft);
}

.tc-line-badge.ln-3pl[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-line-badge.ln-sl[b-a534odb48t] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-type-badge[b-a534odb48t] {
    color: #46556e;
    background: var(--tc-gray-soft);
}

.tc-pill.status-pending[b-a534odb48t] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-pill.status-accepted[b-a534odb48t] {
    color: var(--tc-green);
    background: var(--tc-green-soft);
}

.tc-pill.status-build[b-a534odb48t] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-pill.status-rejected[b-a534odb48t] {
    color: var(--tc-accent);
    background: var(--tc-red-soft);
}

.tc-pill.status-transit[b-a534odb48t],
.tc-pill.status-open[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-pill.status-done[b-a534odb48t] {
    color: #047857;
    background: #d1fae5;
}

.tc-viaje-badge.empty[b-a534odb48t] {
    color: var(--tc-amber);
    background: var(--tc-amber-soft);
}

.tc-viaje-badge.ready[b-a534odb48t] {
    color: var(--tc-blue);
    background: var(--tc-blue-soft);
}

.tc-viaje-badge.transit[b-a534odb48t] {
    color: #1d4ed8;
    background: #dbeafe;
}

.tc-page[b-a534odb48t]  .tc-btn-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .32rem !important;
    box-sizing: border-box !important;
    min-width: 90px !important;
    max-width: 100% !important;
    min-height: 32px !important;
    height: 32px !important;
    border-radius: 7px !important;
    padding: 0 .7rem !important;
    font-size: .68rem !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.tc-page[b-a534odb48t]  .tc-btn-accept {
    border: 1px solid #a7f3d0 !important;
    background: #f0fdf4 !important;
    color: var(--tc-green) !important;
}

.tc-page[b-a534odb48t]  .tc-btn-reject,
.tc-page[b-a534odb48t]  .tc-btn-reason {
    border: 1px solid #fecaca !important;
    background: #fff !important;
    color: var(--tc-accent) !important;
}

.tc-page[b-a534odb48t]  .tc-btn-primary-action,
.tc-page[b-a534odb48t]  .tc-btn-track {
    border: 1px solid #bfdbfe !important;
    background: #fff !important;
    color: var(--tc-blue) !important;
}

.tc-page[b-a534odb48t]  .rz-button .rzi {
    font-size: .9rem !important;
}

.tc-provider-grid[b-a534odb48t] {
    display: grid;
    grid-template-columns: repeat(3, minmax(250px, 1fr));
    gap: .8rem;
    padding: .9rem;
    flex: 1;
    overflow-y: auto;
}

.tc-grid-card[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .7rem;
    min-width: 0;
    padding: .9rem;
    background: #fff;
    border: 1px solid var(--tc-border);
    border-radius: 8px;
    box-shadow: var(--tc-shadow-sm);
}

.tc-grid-card header[b-a534odb48t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.tc-grid-client[b-a534odb48t] {
    display: -webkit-box;
    overflow: hidden;
    color: var(--tc-text);
    font-size: .82rem;
    font-weight: 900;
    text-transform: uppercase;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.tc-grid-badges[b-a534odb48t] {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.tc-grid-meta[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.tc-grid-meta span[b-a534odb48t] {
    color: var(--tc-muted);
    font-size: .68rem;
    font-weight: 800;
}

.tc-grid-meta strong[b-a534odb48t] {
    overflow: hidden;
    color: var(--tc-text);
    font-size: .76rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tc-pagination[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 58px;
    padding: .7rem 1rem;
    border-top: 1px solid var(--tc-border);
    color: var(--tc-muted);
    font-size: .72rem;
    font-weight: 800;
}

.tc-pagination > div[b-a534odb48t] {
    display: flex;
    align-items: center;
    gap: .38rem;
}

.tc-pagination label[b-a534odb48t] {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.tc-page-btn[b-a534odb48t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    border: 1px solid transparent;
    border-radius: 7px;
    color: var(--tc-text);
    background: #fff;
    font-size: .76rem;
    font-weight: 900;
    cursor: pointer;
}

.tc-page-btn.active[b-a534odb48t] {
    color: #fff;
    background: var(--tc-accent);
}

.tc-page-btn:disabled[b-a534odb48t] {
    color: var(--tc-subtle);
    border-color: var(--tc-border);
    cursor: not-allowed;
}

.tc-page-ellipsis[b-a534odb48t] {
    padding: 0 .25rem;
}

.tc-select-size[b-a534odb48t] {
    min-width: 70px;
    min-height: 34px;
}

.tc-modal-backdrop[b-a534odb48t] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(15, 23, 42, .42);
}

.tc-tracking-modal[b-a534odb48t] {
    width: min(760px, 100%);
    max-height: min(720px, calc(100vh - 2rem));
    overflow: auto;
    background: #fff;
    border-radius: 8px;
    border: 1px solid var(--tc-border);
    box-shadow: var(--tc-shadow);
}

.tc-tracking-modal > header[b-a534odb48t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid var(--tc-border);
}

.tc-tracking-modal h2[b-a534odb48t] {
    margin: 0;
    font-size: 1rem;
    font-weight: 900;
}

.tc-tracking-modal header span[b-a534odb48t] {
    color: var(--tc-muted);
    font-size: .78rem;
}

.tc-tracking-modal header button[b-a534odb48t] {
    width: 34px;
    height: 34px;
    border: 1px solid var(--tc-border);
    border-radius: 7px;
    color: var(--tc-muted);
    background: #fff;
    cursor: pointer;
}

.tc-tracking-summary[b-a534odb48t] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--tc-border);
}

.tc-tracking-summary span[b-a534odb48t] {
    display: block;
    color: var(--tc-muted);
    font-size: .68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.tc-tracking-summary strong[b-a534odb48t] {
    display: block;
    margin-top: .2rem;
    overflow-wrap: anywhere;
    color: var(--tc-text);
}

.tc-provider-timeline[b-a534odb48t] {
    display: flex;
    flex-direction: column;
    gap: .7rem;
    padding: 1rem;
}

.tc-provider-event[b-a534odb48t] {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: .55rem;
}

.tc-provider-event > span[b-a534odb48t] {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--tc-accent);
    margin-top: .3rem;
    box-shadow: 0 0 0 4px var(--tc-red-soft);
}

.tc-provider-event strong[b-a534odb48t] {
    display: inline;
    color: var(--tc-text);
    margin-right: .35rem;
}

.tc-provider-event small[b-a534odb48t],
.tc-provider-event p[b-a534odb48t] {
    color: var(--tc-muted);
    margin: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 1500px) {
    .tc-provider-kpis[b-a534odb48t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tc-filter-card[b-a534odb48t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .tc-provider-layout[b-a534odb48t],
    .tc-filter-card[b-a534odb48t],
    .tc-tracking-summary[b-a534odb48t] {
        grid-template-columns: 1fr;
    }

    .tc-provider-kpis[b-a534odb48t],
    .tc-provider-grid[b-a534odb48t] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tc-flow-card[b-a534odb48t] {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .tc-page[b-a534odb48t] {
        padding: .75rem;
    }

    .tc-provider-kpis[b-a534odb48t],
    .tc-provider-grid[b-a534odb48t],
    .tc-status-donut-wrap[b-a534odb48t] {
        grid-template-columns: 1fr;
    }

    .tc-kpi-card[b-a534odb48t] {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .tc-sparkline[b-a534odb48t] {
        display: none;
    }

    .tc-monitor-head[b-a534odb48t],
    .tc-pagination[b-a534odb48t] {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* /Pages/TorreControl/TorreControlTracking.razor.rz.scp.css */
.tc-viaje-empty[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2.5rem;
    color: var(--text);
}

.tc-viaje-empty-icon[b-xpl7k8vdvs] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .tc-viaje-empty-icon[b-xpl7k8vdvs]  .rzi {
        font-size: 1.6rem !important;
        color: var(--muted) !important;
    }

.tc-viaje-empty strong[b-xpl7k8vdvs] {
    color: var(--text);
}

.tc-viaje-empty p[b-xpl7k8vdvs] {
    margin: .2rem 0 0;
    color: var(--muted);
    font-size: .9rem;
}

.ct-section--return[b-xpl7k8vdvs] {
    border-color: #fecdd3 !important;
    background: #fff7f8 !important;
}

.ct-return-note[b-xpl7k8vdvs] {
    color: #9f1239;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.35;
    margin-bottom: .55rem;
}

/* ═══════════════════════════════════════════════════════
   VIAJE LAYOUT — 3 columnas
   ═══════════════════════════════════════════════════════ */
.tc-viaje-layout[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 280px 1fr 280px;
    gap: .85rem;
    align-items: start;
}

/* ── Sidebar izquierdo ── */
.tc-viaje-sidebar[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.tc-viaje-sidebar-header[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1rem;
    display: flex;
    align-items: center;
    gap: .65rem;
}

    .tc-viaje-sidebar-header[b-xpl7k8vdvs]  .rzi {
        font-size: 1.2rem !important;
        color: var(--primary) !important;
    }

.tc-vsb-title[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .95rem;
    color: var(--text);
}

.tc-vsb-sub[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
}

.tc-viaje-list[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.tc-viaje-item[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .75rem .9rem;
    cursor: pointer;
    transition: border-color .14s, box-shadow .14s, background .14s;
}

    .tc-viaje-item:hover[b-xpl7k8vdvs] {
        border-color: #c22a3b;
        box-shadow: 0 2px 12px rgba(194,42,59,.1);
    }

.tc-viaje-item--active[b-xpl7k8vdvs] {
    border-color: #c22a3b !important;
    background: #fff8f8 !important;
    box-shadow: 0 2px 14px rgba(194,42,59,.15) !important;
}

.tc-vi-top[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .25rem;
}

.tc-vi-folio[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .92rem;
    color: var(--text);
}

.tc-vi-chip[b-xpl7k8vdvs] {
    font-size: .65rem !important;
    padding: .12rem .5rem !important;
}

.tc-vi-proveedor[b-xpl7k8vdvs] {
    font-size: .78rem;
    color: var(--muted);
    margin-bottom: .3rem;
}

.tc-vi-meta[b-xpl7k8vdvs] {
    display: flex;
    gap: .65rem;
    flex-wrap: wrap;
}

    .tc-vi-meta span[b-xpl7k8vdvs] {
        display: inline-flex;
        align-items: center;
        gap: .2rem;
        font-size: .75rem;
        color: var(--muted);
        font-weight: 600;
    }

    .tc-vi-meta[b-xpl7k8vdvs]  .rzi {
        font-size: .8rem !important;
    }

/* Botones de acción sidebar */
.tc-viaje-actions[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin-top: .2rem;
}

.tc-vbtn[b-xpl7k8vdvs] {
    width: 100%;
    border-radius: 10px;
    padding: .5rem .85rem;
    font-size: .82rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .4rem;
    transition: background .12s, border-color .12s;
}

    .tc-vbtn[b-xpl7k8vdvs]  .rzi {
        font-size: .9rem !important;
    }

.tc-vbtn-ghost[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    color: var(--text);
}

    .tc-vbtn-ghost:hover[b-xpl7k8vdvs] {
        background: #f8fafc;
        border-color: #c22a3b;
        color: #c22a3b;
    }

/* ── Columna central: tracking ── */
.tc-viaje-center[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.tc-track-header[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.tc-track-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: 1rem;
    color: var(--text);
}

.tc-track-sub[b-xpl7k8vdvs] {
    font-size: .78rem;
    color: var(--muted);
    margin-top: .1rem;
}

.tc-track-meta-grid[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .5rem;
}

.tc-track-meta-item[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .7rem .85rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.tc-track-lbl[b-xpl7k8vdvs] {
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    color: var(--muted);
}

.tc-track-meta-item strong[b-xpl7k8vdvs] {
    font-size: .88rem;
    color: var(--text);
}

.tc-track-ruta-grid[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.tc-track-ruta-box[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .75rem .9rem;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.tc-track-ruta-val[b-xpl7k8vdvs] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}

    .tc-track-ruta-val[b-xpl7k8vdvs]  .rzi {
        font-size: 1.05rem !important;
        margin-top: .1rem;
        flex-shrink: 0;
    }

    .tc-track-ruta-val strong[b-xpl7k8vdvs] {
        font-size: .9rem;
        color: var(--text);
        display: block;
    }

    .tc-track-ruta-val span[b-xpl7k8vdvs] {
        font-size: .75rem;
        color: var(--muted);
        display: block;
    }

/* Visualización de ruta */
.tc-route-visual[b-xpl7k8vdvs] {
    background: linear-gradient(135deg, #1a2232 0%, #0f1520 100%);
    border: 1px solid #2a3347;
    border-radius: var(--r);
    padding: 1.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 120px;
    position: relative;
    overflow: hidden;
}

    .tc-route-visual[b-xpl7k8vdvs]::before {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at 30% 50%, rgba(194,42,59,.12) 0%, transparent 60%), radial-gradient(circle at 70% 50%, rgba(79,93,255,.08) 0%, transparent 60%);
        pointer-events: none;
    }

.tc-route-visual-inner[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0;
    position: relative;
    z-index: 1;
}

.tc-rv-point[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    flex-shrink: 0;
    z-index: 2;
}

    .tc-rv-point span[b-xpl7k8vdvs] {
        font-size: .72rem;
        font-weight: 700;
        color: rgba(255,255,255,.8);
        white-space: nowrap;
        max-width: 90px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.tc-rv-dot[b-xpl7k8vdvs] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4f5dff;
    box-shadow: 0 0 0 4px rgba(79,93,255,.25);
    flex-shrink: 0;
}

.tc-rv-dot-dest[b-xpl7k8vdvs] {
    background: #c22a3b;
    box-shadow: 0 0 0 4px rgba(194,42,59,.25);
}

.tc-rv-line[b-xpl7k8vdvs] {
    flex: 1;
    position: relative;
    height: 3px;
    background: rgba(255,255,255,.1);
    margin: 0 .5rem;
    border-radius: 2px;
}

.tc-rv-line-fill[b-xpl7k8vdvs] {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 55%;
    background: linear-gradient(90deg, #4f5dff, #c22a3b);
    border-radius: 2px;
}

.tc-rv-truck[b-xpl7k8vdvs] {
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
    background: #c22a3b;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 4px rgba(194,42,59,.3), 0 2px 8px rgba(0,0,0,.4);
}

    .tc-rv-truck[b-xpl7k8vdvs]  .rzi {
        font-size: .85rem !important;
        color: #fff !important;
    }

.tc-rv-eta[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    font-weight: 600;
    color: rgba(255,255,255,.65);
    position: relative;
    z-index: 1;
}

    .tc-rv-eta[b-xpl7k8vdvs]  .rzi {
        font-size: .85rem !important;
    }

/* ── Columna derecha ── */
.tc-viaje-right[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.tc-viaje-right-card[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.tc-vrc-header[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-bottom: .6rem;
    border-bottom: 1px solid var(--border);
}

    .tc-vrc-header[b-xpl7k8vdvs]  .rzi {
        font-size: 1.1rem !important;
        color: var(--primary) !important;
    }

.tc-vrc-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .92rem;
    color: var(--text);
}

.tc-vrc-sub[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
}

.tc-vrc-empty[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 1rem;
    color: var(--muted);
    font-size: .85rem;
}

/* Timeline v2 */
.tc-timeline-v2[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
    padding-right: .25rem;
}

.tc-tl2-item[b-xpl7k8vdvs] {
    display: flex;
    gap: .6rem;
}

.tc-tl2-dot-wrap[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    padding-top: .15rem;
}

.tc-tl2-dot[b-xpl7k8vdvs] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.tc-tl2-dot--done[b-xpl7k8vdvs] {
    background: #c22a3b;
    box-shadow: 0 0 0 3px rgba(194,42,59,.15);
}

.tc-tl2-dot--pending[b-xpl7k8vdvs] {
    background: #cbd5e1;
}

.tc-tl2-line[b-xpl7k8vdvs] {
    width: 2px;
    flex: 1;
    min-height: 16px;
    background: var(--border);
    margin: 3px 0;
}

.tc-tl2-item:last-child .tc-tl2-line[b-xpl7k8vdvs] {
    display: none;
}

.tc-tl2-body[b-xpl7k8vdvs] {
    padding-bottom: .8rem;
    flex: 1;
}

.tc-tl2-nombre[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .85rem;
    color: var(--text);
    line-height: 1.2;
}

.tc-tl2-fecha[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
    margin: .1rem 0 .3rem;
}

.tc-tl2-obs[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .25rem;
}

.tc-tl2-badge[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    background: #ede9fe;
    color: #5b21b6;
    font-size: .65rem;
    font-weight: 700;
    padding: .1rem .45rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Solicitud grid */
.tc-sol-grid[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tc-sol-row[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .1rem;
    border-bottom: 1px solid var(--border);
    gap: .5rem;
}

    .tc-sol-row:last-child[b-xpl7k8vdvs] {
        border-bottom: none;
    }

.tc-sol-lbl[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
    font-weight: 600;
}

.tc-sol-row strong[b-xpl7k8vdvs] {
    font-size: .85rem;
    color: var(--text);
    text-align: right;
}

/* ── Responsive viaje layout ── */
@media (max-width: 1200px) {
    .tc-viaje-layout[b-xpl7k8vdvs] {
        grid-template-columns: 240px 1fr 240px;
    }

    .tc-track-meta-grid[b-xpl7k8vdvs] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .tc-viaje-layout[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }

    .tc-track-ruta-grid[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }
}

/* ── Registro de tiempos (sidebar) ──────────────────────── */
.tc-reg-tiempos[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .85rem 1rem;
}

.tc-reg-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .88rem;
    color: var(--text);
}

.tc-reg-sub[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .65rem;
}

.tc-reg-grid[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.tc-reg-item[b-xpl7k8vdvs] {
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .55rem .65rem;
    display: flex;
    flex-direction: column;
    gap: .18rem;
}

.tc-reg-nombre[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .78rem;
    color: var(--text);
}

.tc-reg-fecha[b-xpl7k8vdvs] {
    font-size: .68rem;
    color: var(--muted);
}

/* ── Histórico solicitudes ───────────────────────────────── */
.tc-hist-list[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}

.tc-hist-item[b-xpl7k8vdvs] {
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .55rem .75rem;
}

.tc-hist-top[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .2rem;
}

    .tc-hist-top strong[b-xpl7k8vdvs] {
        font-size: .85rem;
        color: var(--text);
    }

.tc-hist-sub[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
}

/* ── Tipo en item viaje ──────────────────────────────────── */
.tc-vi-tipo[b-xpl7k8vdvs] {
    font-size: .73rem;
    color: var(--muted);
    margin-top: .15rem;
}

    .tc-vi-tipo strong[b-xpl7k8vdvs] {
        color: var(--text);
        font-weight: 700;
    }


/* ── Solicitudes + Trazabilidad sections ──────────────── */
.tc-sol-section[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .9rem 1.1rem;
    margin-top: .75rem;
}

.tc-sol-section-header[b-xpl7k8vdvs] {
    margin-bottom: .75rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid var(--border);
}

.tc-sol-section-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .95rem;
    color: var(--text);
}

.tc-sol-section-sub[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
    margin-top: .1rem;
}

/* ── Solicitud cards ─── */
.tc-sol-cards[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.tc-sol-card[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: .65rem 1rem;
    flex-wrap: wrap;
}

.tc-sol-card-left[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.tc-sol-card-folio[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .9rem;
    color: var(--text);
}

.tc-sol-card-info[b-xpl7k8vdvs] {
    font-size: .78rem;
    color: var(--muted);
}

.tc-sol-card-right[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.tc-sol-act-btn[b-xpl7k8vdvs] {
    border-radius: 8px;
    padding: .3rem .85rem;
    font-size: .8rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background .12s, border-color .12s;
}

.tc-sol-act-accept[b-xpl7k8vdvs] {
    background: #d1fae5;
    color: #065f46;
    border-color: #a7f3d0;
}

    .tc-sol-act-accept:hover[b-xpl7k8vdvs] {
        background: #a7f3d0;
        border-color: #6ee7b7;
    }

.tc-sol-act-reject[b-xpl7k8vdvs] {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

    .tc-sol-act-reject:hover[b-xpl7k8vdvs] {
        background: #fecaca;
        border-color: #fca5a5;
    }

/* ── Trazabilidad cards ─── */
.tc-traz-cards[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tc-traz-item[b-xpl7k8vdvs] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--border);
}

    .tc-traz-item:last-child[b-xpl7k8vdvs] {
        border-bottom: none;
    }

.tc-traz-dot[b-xpl7k8vdvs] {
    width: 10px;
    min-width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: .3rem;
    flex-shrink: 0;
}

.tc-traz-dot--viaje[b-xpl7k8vdvs] {
    background: #c22a3b;
    box-shadow: 0 0 0 3px rgba(194,42,59,.15);
}

.tc-traz-dot--sol[b-xpl7k8vdvs] {
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245,158,11,.15);
}

.tc-traz-dot--none[b-xpl7k8vdvs] {
    background: #cbd5e1;
}

.tc-traz-body[b-xpl7k8vdvs] {
    flex: 1;
    min-width: 0;
}

.tc-traz-nombre[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .88rem;
    color: var(--text);
}

.tc-traz-meta[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
    margin-top: .1rem;
}

/* ── Modal mercancía table ── */
.asv-merc-table-wrap[b-xpl7k8vdvs] {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: auto;
    margin-bottom: .25rem;
}

/* ── Layout 2 columnas para Solicitudes + Trazabilidad ── */
.tc-bottom-grid[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin-top: .75rem;
}

/* Hace las secciones más compactas */
.tc-sol-section[b-xpl7k8vdvs] {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: .75rem 1rem;
}

.tc-sol-section-header[b-xpl7k8vdvs] {
    margin-bottom: .55rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--border);
}

.tc-sol-section-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .88rem;
    color: var(--text);
}

.tc-sol-section-sub[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
}

/* Cards de solicitud más compactas */
.tc-sol-card[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: .5rem .75rem;
    flex-wrap: wrap;
}

.tc-sol-card-folio[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .85rem;
    color: var(--text);
}

.tc-sol-card-info[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: var(--muted);
}

.tc-sol-card-right[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
}

/* Botones icono editar/cancelar */
.tc-sol-icon-btn[b-xpl7k8vdvs] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, border-color .12s;
    flex-shrink: 0;
}

    .tc-sol-icon-btn[b-xpl7k8vdvs]  .rzi {
        font-size: .85rem !important;
        line-height: 1 !important;
        width: auto !important;
        height: auto !important;
    }

.tc-sol-icon-edit[b-xpl7k8vdvs] {
    color: #4f5dff;
}

    .tc-sol-icon-edit:hover[b-xpl7k8vdvs] {
        background: rgba(79,93,255,.1);
        border-color: #4f5dff;
    }

.tc-sol-icon-cancel[b-xpl7k8vdvs] {
    color: #c22a3b;
}

    .tc-sol-icon-cancel:hover[b-xpl7k8vdvs] {
        background: rgba(194,42,59,.1);
        border-color: #c22a3b;
    }

/* Trazabilidad compacta — items en línea */
.tc-traz-item[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem 0;
    border-bottom: 1px solid var(--border);
}

    .tc-traz-item:last-child[b-xpl7k8vdvs] {
        border-bottom: none;
    }

.tc-traz-body[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    min-width: 0;
}

.tc-traz-nombre[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .83rem;
    color: var(--text);
}

.tc-traz-sep[b-xpl7k8vdvs] {
    color: var(--muted);
    font-size: .8rem;
}

.tc-traz-meta[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
}

/* ── Paginación ─────────────────────────────────────────── */
.tc-pagination[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .85rem;
    border-top: 1px solid var(--border);
    background: #f8fafc;
}

.tc-pag-info[b-xpl7k8vdvs] {
    font-size: .75rem;
    color: var(--muted);
    font-weight: 600;
}

.tc-pag-btns[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.tc-pag-btn[b-xpl7k8vdvs] {
    min-width: 30px;
    height: 30px;
    padding: 0 .4rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    color: var(--text);
    font-size: .78rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .12s, border-color .12s, color .12s;
}

    .tc-pag-btn:hover:not(:disabled)[b-xpl7k8vdvs] {
        background: #f1f5f9;
        border-color: #c22a3b;
        color: #c22a3b;
    }

    .tc-pag-btn:disabled[b-xpl7k8vdvs] {
        opacity: .4;
        cursor: not-allowed;
    }

.tc-pag-btn--active[b-xpl7k8vdvs] {
    background: #c22a3b !important;
    border-color: #c22a3b !important;
    color: #fff !important;
}

.tc-pag-btn[b-xpl7k8vdvs]  .rzi {
    font-size: .85rem !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

@media (max-width: 768px) {
    .tc-bottom-grid[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .tc-hero-ref-block[b-xpl7k8vdvs] {
        flex-direction: column;
        gap: .6rem;
    }

    .tc-hero-divider-v[b-xpl7k8vdvs] {
        display: none;
    }

    .tc-viaje-meta[b-xpl7k8vdvs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .tc-fin-summary-row[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }

    .tc-viaje-grid[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }

    .um-stop-val[b-xpl7k8vdvs] {
        max-width: 100%;
        white-space: normal;
    }
}

@media (max-width: 480px) {
    .tc-page.tc-detail[b-xpl7k8vdvs] {
        padding: 0 0 1.5rem;
    }

    .um-title[b-xpl7k8vdvs] {
        font-size: 1.4rem;
    }

    .um-card[b-xpl7k8vdvs] {
        padding: .8rem .85rem;
    }

    .tc-viaje-meta[b-xpl7k8vdvs] {
        grid-template-columns: 1fr 1fr;
    }

    .tc-tabs-bar[b-xpl7k8vdvs] {
        gap: .25rem;
        padding: .3rem .4rem;
    }

    .tc-tab-btn[b-xpl7k8vdvs] {
        padding: .45rem .7rem;
        font-size: .82rem;
    }
}
/* ============================================================
   TORRE DE CONTROL — Mission Control Aesthetic  |  v4 layout
   ============================================================ */

:root[b-xpl7k8vdvs] {
    --ct-bg: #f4f6fb;
    --ct-border: #e2e6f0;
    --ct-navy: #1a2540;
    --ct-label: #7b8a9b;
    --ct-val: #23304d;
    --ct-accent: #4f5dff;
    --ct-green: #18b977;
    --ct-green-bg: #e8faf2;
    --ct-green-bdr: #9de8c3;
    --ct-red: #e84040;
    --ct-red-bg: #fff0f0;
    --ct-red-bdr: #f7bcbc;
    --ct-radius: 10px;
    --ct-shadow: 0 2px 12px rgba(26,37,64,.07);
}

.display-zoom[b-xpl7k8vdvs] {
    zoom: 0.8;
}

/* ── Modal ─────────────────────────────────────────────────── */
.ct-modal[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    background: #f4f6fb;
    min-height: 0;
    height: 100%;
    overflow: hidden; /* desktop: el grid interno maneja el espacio */
}

.ct-modal-topbar[b-xpl7k8vdvs] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0.35rem 0.5rem 0;
    flex-shrink: 0;
    z-index: 20;
    position: relative;
}

.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button {
    color: #334155 !important;
    background: transparent !important;
    border: none !important;
    opacity: 0.85;
    transition: opacity 0.15s, background 0.15s;
}

.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button .rzi,
.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button .rz-button-icon {
    color: #334155 !important;
}

.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button:hover {
    opacity: 1;
    background: rgba(0, 0, 0, 0.06) !important;
    border-radius: 6px;
}

.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button:hover .rzi,
.ct-modal-topbar[b-xpl7k8vdvs]  .rz-button:hover .rz-button-icon {
    color: #0f172a !important;
}

.ct-tramo-chip[b-xpl7k8vdvs] {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    background: #eef2ff;
    color: #4338ca;
    border: 1px solid #c7d2fe;
}

/* ══════════════════════════════════════════════════════════
   NUEVO LAYOUT — 3 columnas con grid-areas
   Columna 1: izquierda (Transportes + Registro)
   Columna 2: centro (Mapa)
   Columna 3: Timeline (toda la altura)
   Fila inferior: Documentos (col 1 + col 2)
   ══════════════════════════════════════════════════════════ */
.ct-layout[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 320px 1fr 310px;
    grid-template-rows: minmax(0, 1fr) auto;
    grid-template-areas:
        "left center timeline"
        "docs  docs   timeline";
    gap: 0.875rem;
    padding: 0.875rem;
    flex: 1;
    min-height: 0;
    height: auto;
    overflow: hidden;
}

@media (max-width: 1280px) {
    .ct-layout[b-xpl7k8vdvs] {
        grid-template-columns: minmax(240px, 0.85fr) minmax(0, 1fr) minmax(260px, 310px);
    }
}

@media (max-width: 1200px) {
    .ct-layout[b-xpl7k8vdvs] {
        grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1fr) 260px;
    }
}

@media (max-width: 992px) {
    .ct-layout[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        grid-template-areas:
            "left"
            "center"
            "timeline"
            "docs";
        overflow-y: auto;
        overflow-x: hidden;
        height: auto;
        min-height: 0;
    }

    .ct-tl-outer[b-xpl7k8vdvs] {
        max-height: min(480px, 55vh);
    }

    .ct-center-panel[b-xpl7k8vdvs] {
        min-height: 280px;
    }
}

@media (max-width: 576px) {
    .ct-layout[b-xpl7k8vdvs] {
        padding: 0.5rem;
        gap: 0.65rem;
    }

    .ct-tl-legend[b-xpl7k8vdvs] {
        flex-wrap: wrap;
        gap: 0.35rem;
    }
}

/* ════════════════════════════════════════════════════════════
   PANEL IZQUIERDO — col 1, filas 1
   ════════════════════════════════════════════════════════════ */
.ct-left-panel[b-xpl7k8vdvs] {
    grid-area: left;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    align-self: stretch;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 2px;
    /* Scroll interno cuando el contenido crece (p. ej. Agregar punto de tracking). */
}

.ct-left-panel > .ct-section[b-xpl7k8vdvs] {
    flex: 0 0 auto;
}

    .ct-left-panel[b-xpl7k8vdvs]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-left-panel[b-xpl7k8vdvs]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

/* ════════════════════════════════════════════════════════════
   PANEL CENTRAL — col 2, fila 1
   min-height 0 para que flex/grid repartan alto fijo entre columna centro y timeline.
   ════════════════════════════════════════════════════════════ */
.ct-center-panel[b-xpl7k8vdvs] {
    grid-area: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE — col 3, filas 1+2 (toda la altura)
   ════════════════════════════════════════════════════════════ */
.ct-tl-outer[b-xpl7k8vdvs] {
    grid-area: timeline;
    display: flex;
    flex-direction: column;
    align-self: stretch;
    height: 100%;
    max-height: 100%;
    background: #fafbfd;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    min-height: 0;
    overflow: hidden;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS — cols 1+2, fila 2 (abajo)
   max-height reducida: muestra 2-3 filas + scroll
   ════════════════════════════════════════════════════════════ */
.ct-docs-section[b-xpl7k8vdvs] {
    grid-area: docs;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 195px; /* ≈ header + 3 filas de tabla */
    align-self: start; /* no estira: deja espacio visible entre Registro y Docs */
}

/* Contenedor scrolleable para la grid de archivos guardados */
.ct-docs-scroll-wrap[b-xpl7k8vdvs] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

.tc-detail-table[b-xpl7k8vdvs] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.tc-detail-table thead th[b-xpl7k8vdvs] {
    background: #f8fafc;
    border-bottom: 1px solid #dbe3f0;
    color: #64748b;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1.2;
    padding: .6rem .7rem;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.tc-detail-table tbody td[b-xpl7k8vdvs] {
    border-bottom: 1px solid #e8edf6;
    color: #1f2a44;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.35;
    padding: .62rem .7rem;
    vertical-align: middle;
    white-space: normal;
    overflow-wrap: anywhere;
}

.tc-detail-table tbody tr:last-child td[b-xpl7k8vdvs] {
    border-bottom: 0;
}

.tc-mercancia-asignada[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    max-height: 220px;
    overflow: hidden;
}

.tc-mercancia-scroll[b-xpl7k8vdvs] {
    overflow: auto;
}

.tc-mercancia-table[b-xpl7k8vdvs] {
    min-width: 620px;
    font-size: .78rem;
}

    .ct-docs-scroll-wrap[b-xpl7k8vdvs]::-webkit-scrollbar {
        width: 5px;
    }

    .ct-docs-scroll-wrap[b-xpl7k8vdvs]::-webkit-scrollbar-thumb {
        background: #c8d0e0;
        border-radius: 4px;
    }

    .ct-docs-scroll-wrap[b-xpl7k8vdvs]::-webkit-scrollbar-track {
        background: #f4f6fb;
    }

/* Prompt: sin transporte seleccionado */
.ct-select-prompt[b-xpl7k8vdvs] {
    grid-column: 2 / 4;
    grid-row: 1 / 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.875rem;
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    padding: 2rem;
    text-align: center;
}

/* ════════════════════════════════════════════════════════════
   SECCIÓN GENÉRICA
   ════════════════════════════════════════════════════════════ */
.ct-section[b-xpl7k8vdvs] {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
    overflow: hidden;
}

.ct-section-hdr[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fafbfd;
    flex-shrink: 0;
}

.ct-section-title[b-xpl7k8vdvs] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ba8b8;
    flex: 1;
}

.ct-section-body[b-xpl7k8vdvs] {
    padding: 0.875rem 1rem;
}

/* ── Transport list ─────────────────────────────────────────── */
.ct-transport-list[b-xpl7k8vdvs] {
    /* altura fija ≈ 2.5 cards → scroll para el resto */
    height: 195px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.625rem;
}

.ct-transport-list--slots[b-xpl7k8vdvs] {
    background-image: linear-gradient(rgba(79,93,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(79,93,255,.06) 1px, transparent 1px);
    background-size: 18px 18px;
    background-color: #f6f7fc;
    border-radius: 0 0 10px 10px;
    min-height: 130px;
}

.ct-transport-list[b-xpl7k8vdvs]::-webkit-scrollbar {
    width: 4px;
}

.ct-transport-list[b-xpl7k8vdvs]::-webkit-scrollbar-thumb {
    background: #c8d0e0;
    border-radius: 4px;
}

.ct-transport-empty[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1.5rem;
    color: #9ba8b8;
    font-size: 0.8rem;
    font-style: italic;
    width: 100%;
}

/* ── Transport card ─────────────────────────────────────────── */
.ct-transport-card[b-xpl7k8vdvs] {
    background: #fff;
    border: 1.5px solid #e2e6f0;
    border-radius: 8px;
    padding: 0.55rem 0.875rem; /* más compacto */
    cursor: pointer;
    transition: all 0.18s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(26,37,64,.06);
}

    .ct-transport-card[b-xpl7k8vdvs]::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: transparent;
        transition: background 0.18s ease;
        border-radius: 3px 0 0 3px;
    }

    .ct-transport-card:hover[b-xpl7k8vdvs] {
        border-color: #c3caff;
        box-shadow: 0 2px 10px rgba(79,93,255,.12);
        transform: translateX(2px);
    }

.ct-transport-card--active[b-xpl7k8vdvs] {
    border-color: #4f5dff;
    background: #f5f6ff;
    box-shadow: 0 2px 12px rgba(79,93,255,.14);
}

    .ct-transport-card--active[b-xpl7k8vdvs]::before {
        background: #4f5dff;
    }

/* S1 — Placas + Tipo chip + Estado badge en la misma fila */
.ct-card-row1[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.28rem;
}

.ct-card-row1-right[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.ct-card-plates[b-xpl7k8vdvs] {
    font-size: 0.92rem;
    font-weight: 800;
    color: #1a2540;
    letter-spacing: 0.03em;
    line-height: 1.2;
}

/* S2 — Conductor */
.ct-card-driver[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    font-size: 0.74rem;
    font-weight: 600;
    color: #555f70;
    margin-bottom: 0.28rem;
}

.ct-card-driver-icon[b-xpl7k8vdvs] {
    font-size: 0.8rem !important;
    color: #9ba8b8;
    flex-shrink: 0;
}

/* S3 — Referencia ALO (izq) + Ver detalle (der) en misma línea */
.ct-card-row3[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
}

.ct-card-meta[b-xpl7k8vdvs] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin-bottom: 0.35rem;
}

.ct-meta-chip[b-xpl7k8vdvs] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #7b8a9b;
    background: #f1f4f8;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ct-card-ref[b-xpl7k8vdvs] {
    font-size: 0.73rem;
    font-weight: 600;
    color: #4f5dff;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ct-btn-tracking[b-xpl7k8vdvs] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.68rem;
    font-weight: 700;
    color: #4f5dff;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
    flex-shrink: 0;
}

    .ct-btn-tracking:hover[b-xpl7k8vdvs] {
        color: #3245e0;
    }

/* ── Status badges ──────────────────────────────────────────── */
.ct-status[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.6rem;
    border-radius: 20px;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ct-status-1[b-xpl7k8vdvs] {
    background: #1a2540;
    color: #fff;
}

.ct-status-2[b-xpl7k8vdvs] {
    background: #fff3cd;
    color: #92600a;
    border: 1px solid #fcd34d;
}

.ct-status-3[b-xpl7k8vdvs] {
    background: #e8faf2;
    color: #0f7a50;
    border: 1px solid #9de8c3;
}

.ct-status-4[b-xpl7k8vdvs] {
    background: #fff0f0;
    color: #e84040;
    border: 1px solid #f7bcbc;
}

.ct-status-5[b-xpl7k8vdvs] {
    background: #f1f4f8;
    color: #555f70;
    border: 1px solid #d0d6e0;
}

.ct-status-7[b-xpl7k8vdvs] {
    background: #edf0ff;
    color: #4f5dff;
    border: 1px solid #c3caff;
}

.ct-status-10[b-xpl7k8vdvs] {
    background: #fff0e0;
    color: #b45309;
    border: 1px solid #fcd49a;
}

/* ── Form fields ────────────────────────────────────────────── */
.ct-field[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
    margin-bottom: 0.7rem;
}

.ct-lbl[b-xpl7k8vdvs] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #7b8a9b;
    letter-spacing: 0.03em;
}

.ct-field-row[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.ct-upload-label[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}

/* ══════════════════════════════════════════════════════════
   BOTONES — colores hardcodeados (Blazor scoped CSS no
   resuelve :root vars de forma confiable)
   ══════════════════════════════════════════════════════════ */
.ct-actions[b-xpl7k8vdvs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.ct-btn[b-xpl7k8vdvs] {
    height: 34px;
    padding: 0 0.875rem;
    border-radius: 7px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

.ct-btn--primary[b-xpl7k8vdvs] {
    background: #4f5dff;
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,93,255,.32);
}

    .ct-btn--primary:hover:not(:disabled)[b-xpl7k8vdvs] {
        background: #3245e0;
        box-shadow: 0 3px 12px rgba(79,93,255,.42);
    }

    .ct-btn--primary:disabled[b-xpl7k8vdvs] {
        background: #a5acff;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--outline[b-xpl7k8vdvs] {
    background: #fff;
    border: 1.5px solid #c8d0e0;
    color: #23304d;
}

    .ct-btn--outline:hover:not(:disabled)[b-xpl7k8vdvs] {
        border-color: #4f5dff;
        color: #4f5dff;
    }

    .ct-btn--outline:disabled[b-xpl7k8vdvs] {
        opacity: 0.5;
        cursor: default;
    }

.ct-btn--danger[b-xpl7k8vdvs] {
    background: #e84040;
    color: #fff;
    box-shadow: 0 2px 8px rgba(232,64,64,.30);
}

    .ct-btn--danger:hover:not(:disabled)[b-xpl7k8vdvs] {
        background: #c42f2f;
    }

    .ct-btn--danger:disabled[b-xpl7k8vdvs] {
        background: #f4a0a0;
        box-shadow: none;
        cursor: default;
    }

.ct-btn--fin[b-xpl7k8vdvs] {
    background: #23304d;
    color: #fff;
    box-shadow: 0 2px 8px rgba(35,48,77,.26);
}

    .ct-btn--fin:hover:not(:disabled)[b-xpl7k8vdvs] {
        background: #1a2540;
    }

    .ct-btn--fin:disabled[b-xpl7k8vdvs] {
        background: #7b8a9b;
        box-shadow: none;
        cursor: default;
    }

.ct-divider[b-xpl7k8vdvs] {
    height: 1px;
    background: #e2e6f0;
    margin: 0.75rem 0;
}

/* ══════════════════════════════════════════════════════════
   RADZEN UPLOAD & SPLITBUTTON
   ══════════════════════════════════════════════════════════ */
.ct-rz-upload .rz-fileupload[b-xpl7k8vdvs],
.ct-rz-upload .rz-fileupload-buttonbar[b-xpl7k8vdvs] {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.ct-rz-upload .rz-button.rz-fileupload-choose[b-xpl7k8vdvs] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
}

    .ct-rz-upload .rz-button.rz-fileupload-choose:hover[b-xpl7k8vdvs] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

.ct-rz-upload--action .rz-button.rz-fileupload-choose[b-xpl7k8vdvs] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: 1.5px solid #4f5dff !important;
    color: #4f5dff !important;
    box-shadow: 0 2px 8px rgba(79,93,255,.14) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: background .15s, color .15s !important;
}

    .ct-rz-upload--action .rz-button.rz-fileupload-choose:hover[b-xpl7k8vdvs] {
        background: #4f5dff !important;
        color: #fff !important;
    }

/* ── Botón compacto "Documento" con ícono clip (panel izquierdo) */
.ct-rz-upload--doc .rz-button.rz-fileupload-choose[b-xpl7k8vdvs] {
    height: 34px !important;
    padding: 0 0.875rem !important;
    border-radius: 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #fff !important;
    border: 1.5px solid #c8d0e0 !important;
    color: #23304d !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s !important;
    width: auto !important;
}

    .ct-rz-upload--doc .rz-button.rz-fileupload-choose:hover[b-xpl7k8vdvs] {
        border-color: #4f5dff !important;
        color: #4f5dff !important;
    }

/* Ocultar lista nativa Radzen en el botón doc */
.ct-rz-upload--doc .rz-fileupload-content[b-xpl7k8vdvs],
.ct-rz-upload--doc .rz-fileupload-files[b-xpl7k8vdvs],
.ct-rz-upload--doc .rz-messages[b-xpl7k8vdvs],
.ct-rz-upload--doc .rz-g[b-xpl7k8vdvs],
.ct-rz-upload--doc table[b-xpl7k8vdvs],
.ct-rz-upload--doc .rz-fileupload > *:not(.rz-fileupload-buttonbar)[b-xpl7k8vdvs] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton)[b-xpl7k8vdvs] {
    height: 36px !important;
    padding: 0 1rem !important;
    border-radius: 7px 0 0 7px !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    background: #23304d !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(35,48,77,.26) !important;
    transition: background .15s !important;
}

    .ct-rz-splitbtn .rz-button:not(.rz-splitbutton-menubutton):hover[b-xpl7k8vdvs] {
        background: #1a2540 !important;
    }

.ct-rz-splitbtn .rz-button.rz-splitbutton-menubutton[b-xpl7k8vdvs] {
    height: 36px !important;
    width: 32px !important;
    border-radius: 0 7px 7px 0 !important;
    background: #1a2540 !important;
    border: none !important;
    border-left: 1px solid rgba(255,255,255,.18) !important;
    color: #fff !important;
}

/* ════════════════════════════════════════════════════════════
   ACTION BAR
   ════════════════════════════════════════════════════════════ */
.ct-action-bar[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════
   MAPA — ocupa todo el alto de la fila 1 (igual que panel izq)
   ════════════════════════════════════════════════════════════ */
.ct-map-wrap[b-xpl7k8vdvs] {
    position: relative;
    /* flex:1 eliminado — el ct-center-panel es flex-column y el mapa debe
       llenar toda la altura disponible de la fila del grid, que es igual
       a la altura total del panel izquierdo (Transportes + Registro tiempos) */
    flex: 1;
    min-height: 0;
    background: #eef0f7;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(26,37,64,.07);
}

#map[b-xpl7k8vdvs] {
    height: 100%;
    width: 100%;
    min-height: 300px;
}

.ct-map-placeholder[b-xpl7k8vdvs] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(248,249,253,.93);
    backdrop-filter: blur(2px);
    gap: 0.6rem;
    color: #9ba8b8;
    z-index: 500;
    pointer-events: none;
}

.ct-map-placeholder-icon[b-xpl7k8vdvs] {
    font-size: 2.8rem;
    opacity: 0.28;
    color: #4f5dff;
}

.ct-map-placeholder-txt[b-xpl7k8vdvs] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #7b8a9b;
}

.ct-map-placeholder-hint[b-xpl7k8vdvs] {
    font-size: 0.73rem;
    color: #b0bac9;
    max-width: 220px;
    text-align: center;
    line-height: 1.4;
}

/* ════════════════════════════════════════════════════════════
   TIMELINE
   ════════════════════════════════════════════════════════════ */
/* Timeline header: una sola fila con todos los elementos alineados */
.ct-tl-hdr[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    border-bottom: 1px solid #e2e6f0;
    background: #fff;
    flex-shrink: 0;
    border-radius: 10px 10px 0 0;
    flex-wrap: nowrap;
    min-width: 0;
    overflow: hidden;
}

.ct-tl-hdr-left[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .3rem;
    flex-shrink: 0;
}

/* El spacer empuja la parte derecha al extremo */
.ct-tl-hdr-left[b-xpl7k8vdvs]::after {
    content: none;
}

.ct-tl-hdr-right[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex: 1;
    justify-content: flex-end;
    flex-wrap: nowrap;
    min-width: 0;
    overflow: hidden;
}

.ct-tl-hdr-title[b-xpl7k8vdvs] {
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #475569;
    white-space: nowrap;
}

.ct-tl-legend[b-xpl7k8vdvs] {
    display: flex;
    gap: 0.35rem;
    flex-shrink: 1;
    flex-wrap: nowrap;
    min-width: 0;
    align-items: center;
}

/* En pantallas donde el timeline se vuelve columna completa, se puede wrap */
@media (max-width: 992px) {
    .ct-tl-hdr[b-xpl7k8vdvs] {
        flex-wrap: wrap;
    }
    .ct-tl-hdr-right[b-xpl7k8vdvs] {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.ct-tl-legend-item[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.58rem;
    font-weight: 700;
    color: #7b8a9b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ct-tl-legend-dot[b-xpl7k8vdvs] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.ct-tl-legend-dot--ctrl[b-xpl7k8vdvs] {
    background: #18b977;
}

.ct-tl-legend-dot--incident[b-xpl7k8vdvs] {
    background: #e84040;
}

.ct-tl-scroll[b-xpl7k8vdvs] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.625rem;
}

    .ct-tl-scroll[b-xpl7k8vdvs]::-webkit-scrollbar {
        width: 4px;
    }

    .ct-tl-scroll[b-xpl7k8vdvs]::-webkit-scrollbar-thumb {
        background: #d0d6e0;
        border-radius: 4px;
    }

.ct-tl-empty[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.5rem;
    color: #b0bac9;
    font-size: 0.82rem;
    text-align: center;
    padding: 1.5rem;
}

.ct-tl-list[b-xpl7k8vdvs] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: 14px;
}

    .ct-tl-list[b-xpl7k8vdvs]::before {
        content: '';
        position: absolute;
        left: 14px;
        top: 16px;
        bottom: 16px;
        width: 2px;
        background: linear-gradient(to bottom, #18b977 0%, #c3caff 50%, #e84040 100%);
        opacity: 0.3;
        border-radius: 2px;
    }

.ct-tl-item[b-xpl7k8vdvs] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.35rem 0.35rem 0.35rem 0;
    cursor: pointer;
    border-radius: 7px;
    transition: background 0.15s ease;
    margin-bottom: 2px;
}

    .ct-tl-item:hover[b-xpl7k8vdvs] {
        background: rgba(79,93,255,.045);
    }

.ct-tl-dot[b-xpl7k8vdvs] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    transition: transform 0.15s ease;
}

.ct-tl-item:hover .ct-tl-dot[b-xpl7k8vdvs] {
    transform: scale(1.12);
}

.ct-tl-dot--ctrl[b-xpl7k8vdvs] {
    background: linear-gradient(135deg, #2dd473, #18b977);
    border: 2px solid #fff;
}

.ct-tl-dot--incident[b-xpl7k8vdvs] {
    background: linear-gradient(135deg, #ff6b6b, #e84040);
    border: 2px solid #fff;
}

.ct-tl-dot-icon[b-xpl7k8vdvs] {
    font-size: 0.85rem;
    color: #fff;
}

.ct-tl-dot--pulse[b-xpl7k8vdvs]::after {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 2px solid currentColor;
    opacity: 0;
    animation: ct-pulse-b-xpl7k8vdvs 2s infinite;
}

.ct-tl-dot--ctrl.ct-tl-dot--pulse[b-xpl7k8vdvs] {
    color: #18b977;
}

.ct-tl-dot--incident.ct-tl-dot--pulse[b-xpl7k8vdvs] {
    color: #e84040;
}

@keyframes ct-pulse-b-xpl7k8vdvs {
    0% {
        transform: scale(1);
        opacity: 0.7;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

.ct-tl-card[b-xpl7k8vdvs] {
    flex: 1;
    min-width: 0;
    padding: 0.4rem 0.55rem;
    border-radius: 7px;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.ct-tl-tramo-divider[b-xpl7k8vdvs] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .45rem 0 .35rem;
    padding-left: 2.35rem;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.ct-tl-tramo-divider[b-xpl7k8vdvs]::before,
.ct-tl-tramo-divider[b-xpl7k8vdvs]::after {
    content: '';
    height: 1px;
    flex: 1;
    min-width: .75rem;
    background: #e2e8f0;
}

.ct-tl-tramo-divider span[b-xpl7k8vdvs] {
    padding: .18rem .55rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .08);
}

.ct-tl-tramo-divider--ida span[b-xpl7k8vdvs] {
    color: #3730a3;
    border-color: #c7d2fe;
    background: #eef2ff;
}

.ct-tl-tramo-divider--vuelta span[b-xpl7k8vdvs] {
    color: #047857;
    border-color: #a7f3d0;
    background: #ecfdf5;
}

.ct-tl-card-top[b-xpl7k8vdvs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .45rem;
}

.ct-tl-tramo-badge[b-xpl7k8vdvs] {
    flex-shrink: 0;
    padding: .08rem .35rem;
    border-radius: 999px;
    font-size: .55rem;
    font-weight: 800;
    letter-spacing: .06em;
    line-height: 1.2;
}

.ct-tl-tramo-badge--ida[b-xpl7k8vdvs] {
    color: #3730a3;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
}

.ct-tl-tramo-badge--vuelta[b-xpl7k8vdvs] {
    color: #047857;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
}

.ct-tl-item--ctrl .ct-tl-card[b-xpl7k8vdvs] {
    background: #e8faf2;
    border-color: #9de8c3;
}

.ct-tl-item--ctrl:hover .ct-tl-card[b-xpl7k8vdvs] {
    background: #d1f7e5;
    border-color: #18b977;
}

.ct-tl-item--incident .ct-tl-card[b-xpl7k8vdvs] {
    background: #fff0f0;
    border-color: #f7bcbc;
}

.ct-tl-item--incident:hover .ct-tl-card[b-xpl7k8vdvs] {
    background: #ffdede;
    border-color: #e84040;
}

.ct-tl-card-title[b-xpl7k8vdvs] {
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.3;
    word-break: break-word;
}

.ct-tl-item--ctrl .ct-tl-card-title[b-xpl7k8vdvs] {
    color: #0a6b41;
}

.ct-tl-item--incident .ct-tl-card-title[b-xpl7k8vdvs] {
    color: #b02020;
}

.ct-tl-card-date[b-xpl7k8vdvs] {
    font-size: 0.65rem;
    color: #7b8a9b;
    margin-top: 0.12rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* ════════════════════════════════════════════════════════════
   DOCUMENTOS PENDIENTES
   ════════════════════════════════════════════════════════════ */
.ct-docs-pending[b-xpl7k8vdvs] {
    padding: 0.75rem 1rem;
    border-top: 1px solid #e2e6f0;
}

.ct-docs-pending-title[b-xpl7k8vdvs] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #7b8a9b;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

.ct-empty-state[b-xpl7k8vdvs] {
    padding: 1rem;
    text-align: center;
    color: #9ba8b8;
    font-size: 0.82rem;
    font-style: italic;
}

.ct-select-prompt-icon[b-xpl7k8vdvs] {
    font-size: 3rem;
    color: #c3caff;
}

.ct-select-prompt-title[b-xpl7k8vdvs] {
    font-size: 1rem;
    font-weight: 700;
    color: #23304d;
}

.ct-select-prompt-sub[b-xpl7k8vdvs] {
    font-size: 0.82rem;
    color: #7b8a9b;
    max-width: 280px;
}

.ct-badge[b-xpl7k8vdvs] {
    background: #4f5dff;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    letter-spacing: 0.03em;
}

.ct-loading[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    color: #7b8a9b;
    font-size: 0.82rem;
}

/* ===== Spinner estilo GenerarSolicitudProveedorModal ===== */
.gsp-spinner[b-xpl7k8vdvs] {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 3px solid var(--gsp-border, #e2e6f0);
    border-top-color: var(--gsp-accent, #c22a3b);
    animation: gspSpin-b-xpl7k8vdvs .9s linear infinite;
    flex-shrink: 0;
}

.gsp-spinner--xs[b-xpl7k8vdvs] {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

.gsp-spinner--sm[b-xpl7k8vdvs] {
    width: 18px;
    height: 18px;
    border-width: 3px;
}

.gsp-spinner--md[b-xpl7k8vdvs] {
    width: 28px;
    height: 28px;
    border-width: 3px;
}

@keyframes gspSpin-b-xpl7k8vdvs {
    to { transform: rotate(360deg); }
}

/* ── Radzen grid overrides ──────────────────────────────────── */
.ct-modal .rz-grid-table thead th[b-xpl7k8vdvs] {
    background: #23304d !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
}

.ct-modal .rz-grid-table tbody td[b-xpl7k8vdvs] {
    font-size: 0.78rem !important;
}

/* Leaflet + mapa Torre Control */
.leaflet-popup-content-wrapper[b-xpl7k8vdvs],
.leaflet-popup-tip[b-xpl7k8vdvs] {
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,.15);
}

#tcTorreMap[b-xpl7k8vdvs] {
    height: 100%;
    width: 100%;
    min-height: 300px;
}

.tc-viaje-mission.ct-modal[b-xpl7k8vdvs] {
    min-height: 520px;
    border-radius: 12px;
    overflow: hidden;
}

.ct-section--times[b-xpl7k8vdvs] {
    flex-shrink: 0;
}

/* ── Trazabilidad: contraste legible (Mercancía) ───────────────── */
.tc-traz-meta[b-xpl7k8vdvs] {
    color: #334155;
    font-weight: 500;
    font-size: .8rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem .35rem;
}

.tc-traz-inline-muted[b-xpl7k8vdvs] {
    color: #64748b;
    font-weight: 500;
}

.tc-traz-link-btn.rz-button[b-xpl7k8vdvs] {
    color: #1e3a8a !important;
    font-weight: 700 !important;
    text-decoration: underline;
    text-underline-offset: 2px;
}

    .tc-traz-link-btn.rz-button:hover[b-xpl7k8vdvs] {
        color: #1d4ed8 !important;
        background: rgba(79, 93, 255, 0.1) !important;
    }

.tc-hitos-rapidos[b-xpl7k8vdvs] {
    margin-bottom: .5rem;
    padding: .45rem .5rem;
    border-radius: 8px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.tc-hitos-rapidos-lbl[b-xpl7k8vdvs] {
    display: block;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: .35rem;
}

.tc-hitos-rapidos-row[b-xpl7k8vdvs] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

/* ── Mapa: barra de acciones + aviso (sin overlay bloqueante) ───── */
.ct-action-bar--map[b-xpl7k8vdvs] {
    align-items: center;
    margin-bottom: .5rem;
}

.ct-action-bar-spacer[b-xpl7k8vdvs] {
    flex: 1;
    min-width: .25rem;
}

.ct-meta-chip--strong[b-xpl7k8vdvs] {
    font-weight: 800;
    color: #0f172a;
    background: #e2e8f0;
    border: 1px solid #cbd5e1;
}

.ct-map-track-hint[b-xpl7k8vdvs] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .5rem .65rem;
    margin-bottom: .5rem;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #475569;
    font-size: .8rem;
    line-height: 1.35;
}

.tc-sr-only-input[b-xpl7k8vdvs] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.tc-plantilla-file-wrap[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    cursor: pointer;
    margin-right: .25rem;
}

/* ── Ruta operativa (estilo compacto tipo UltimaMillaTran) ──────── */
.tc-route-section[b-xpl7k8vdvs] {
    flex-shrink: 0;
    margin-bottom: .65rem;
    padding: .65rem .75rem;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    background: #fff;
    box-shadow: 0 2px 10px rgba(26, 37, 64, .05);
}

.tc-route-section-hdr[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: .55rem;
    padding-bottom: .45rem;
    border-bottom: 1px solid #eef0f7;
}

.tc-route-section-title[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .82rem;
    color: #1a2540;
    flex: 1;
}

.tc-route-grid[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: .5rem;
    align-items: stretch;
}

@media (max-width: 720px) {
    .tc-route-grid[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }

    .tc-route-arrow[b-xpl7k8vdvs] {
        display: none;
    }
}

.tc-loc-card[b-xpl7k8vdvs] {
    border-radius: 10px;
    padding: .55rem .65rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    min-height: 72px;
}

.tc-loc-card--origin[b-xpl7k8vdvs] {
    border-top: 3px solid #22c55e;
}

.tc-loc-card--dest[b-xpl7k8vdvs] {
    border-top: 3px solid #4f5dff;
}

.tc-loc-badge[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: .35rem;
    color: #64748b;
}

.tc-loc-badge--origin[b-xpl7k8vdvs] {
    color: #15803d;
}

.tc-loc-badge--dest[b-xpl7k8vdvs] {
    color: #4338ca;
}

.tc-loc-name[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .84rem;
    color: #0f172a;
    line-height: 1.35;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-route-arrow[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .15rem;
    min-width: 28px;
}

.tc-arrow-line[b-xpl7k8vdvs] {
    flex: 1;
    width: 2px;
    background: linear-gradient(#e2e8f0, #cbd5e1);
    border-radius: 2px;
    min-height: 8px;
}

.tc-route-meta-row[b-xpl7k8vdvs] {
    margin-top: .55rem;
}

.tc-loc-meta-val[b-xpl7k8vdvs] {
    font-weight: 700;
    font-size: .82rem;
    color: #1e293b;
}

/* ════════════════════════════════════════════════════════════
   RUTA FULL (diseño tarjetas con detalles de ubicación)
   ════════════════════════════════════════════════════════════ */
.tc-ruta-full[b-xpl7k8vdvs] {
    flex-shrink: 0;
    margin-bottom: .65rem;
    border-radius: 10px;
    border: 1px solid #e2e6f0;
    background: #fff;
    box-shadow: 0 2px 10px rgba(26,37,64,.05);
    overflow: hidden;
}

.tc-ruta-hdr[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .85rem;
    background: #f8fafc;
    border-bottom: 1px solid #eef0f7;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #4f5dff;
}

.tc-ruta-hdr-title[b-xpl7k8vdvs] {
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    color: #4f5dff;
}

.tc-ruta-meta-inline[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .3rem;
    margin-left: auto;
    font-size: .72rem;
    font-weight: 600;
    color: #475569;
    text-transform: none;
    letter-spacing: 0;
}

.tc-ruta-cards-row[b-xpl7k8vdvs] {
    display: grid;
    grid-template-columns: 1fr 28px 1fr;
    align-items: start;
    padding: .65rem .75rem;
    gap: 0;
}

@media (max-width: 700px) {
    .tc-ruta-cards-row[b-xpl7k8vdvs] {
        grid-template-columns: 1fr;
    }
    .tc-ruta-arrow-sep[b-xpl7k8vdvs] {
        display: none;
    }
}

.tc-ruta-card[b-xpl7k8vdvs] {
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    padding: .55rem .7rem;
}

.tc-ruta-card--orig[b-xpl7k8vdvs] {
    border-top: 3px solid #22c55e;
}

.tc-ruta-card--dest[b-xpl7k8vdvs] {
    border-top: 3px solid #4f5dff;
}

.tc-ruta-card-hdr[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    margin-bottom: .35rem;
    flex-wrap: wrap;
}

.tc-ruta-badge[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: .15rem .45rem;
    border-radius: 20px;
}

.tc-ruta-badge .material-icons[b-xpl7k8vdvs] {
    font-size: .75rem;
}

.tc-ruta-badge--orig[b-xpl7k8vdvs] {
    background: #dcfce7;
    color: #15803d;
}

.tc-ruta-badge--dest[b-xpl7k8vdvs] {
    background: #eef2ff;
    color: #4338ca;
}

.tc-ruta-fecha[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .62rem;
    color: #64748b;
    font-weight: 500;
}

.tc-ruta-fecha .material-icons[b-xpl7k8vdvs] {
    font-size: .75rem;
}

.tc-ruta-nombre[b-xpl7k8vdvs] {
    font-weight: 800;
    font-size: .88rem;
    color: #0f172a;
    line-height: 1.3;
    margin-bottom: .45rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-ruta-detalle-tabla[b-xpl7k8vdvs] {
    width: 100%;
    border-collapse: collapse;
    font-size: .72rem;
}

.tc-ruta-detalle-tabla tr td[b-xpl7k8vdvs] {
    padding: .08rem .1rem;
    vertical-align: top;
    color: #1e293b;
    line-height: 1.4;
}

.tc-rdt-lbl[b-xpl7k8vdvs] {
    color: #64748b;
    font-weight: 600;
    white-space: nowrap;
    padding-right: .55rem !important;
    min-width: 70px;
}

.tc-rdt-ref[b-xpl7k8vdvs] {
    color: #4338ca;
    font-weight: 600;
    overflow-wrap: break-word;
    word-break: break-word;
}

.tc-ruta-arrow-sep[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1.8rem;
    color: #4f5dff;
}

.tc-ruta-arrow-sep .material-icons[b-xpl7k8vdvs] {
    font-size: 1.2rem;
}

/* ════════════════════════════════════════════════════════════
   TRACKING PANEL (left column, colapsable)
   ════════════════════════════════════════════════════════════ */
.ct-section--tracking .tc-tracking-hdr[b-xpl7k8vdvs] {
    background: #f0f4ff;
    border-bottom: 1px solid #d8e0ff;
}

.tc-tracking-body[b-xpl7k8vdvs] {
    padding: .65rem .75rem .75rem !important;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.tc-tracking-divider-line[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .65rem;
    color: #94a3b8;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: .3rem 0;
}

.tc-tracking-divider-line[b-xpl7k8vdvs]::before,
.tc-tracking-divider-line[b-xpl7k8vdvs]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e2e8f0;
}

.ct-map-meta-bar[b-xpl7k8vdvs] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .4rem .65rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e2e6f0;
    flex-shrink: 0;
}

.ct-tramo-chip--ida[b-xpl7k8vdvs] {
    background: #eef2ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
    font-weight: 700;
}

.ct-tramo-chip--vuelta[b-xpl7k8vdvs] {
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    font-weight: 700;
}

.ct-trazabilidad-pill[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .2rem .55rem .2rem .35rem;
    border-radius: 999px;
    border: 1px solid #dbe3f0;
    background: linear-gradient(180deg, #fafbff 0%, #f1f5f9 100%);
    cursor: default;
    user-select: none;
    transition: border-color .15s, box-shadow .15s;
}

.ct-trazabilidad-pill[b-xpl7k8vdvs]  .rz-switch {
    cursor: pointer;
    flex-shrink: 0;
}

.ct-trazabilidad-pill:hover[b-xpl7k8vdvs] {
    border-color: #a5b4fc;
    box-shadow: 0 1px 4px rgba(79, 93, 255, .12);
}

.ct-trazabilidad-pill__lbl[b-xpl7k8vdvs] {
    font-size: .72rem;
    font-weight: 700;
    color: #475569;
    letter-spacing: .02em;
}

.ct-retorno-alert[b-xpl7k8vdvs] {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .25rem 0 .5rem;
    padding: .5rem .65rem;
    border-radius: 8px;
    border: 1px solid #fcd34d;
    background: #fffbeb;
    font-size: .78rem;
    font-weight: 600;
    color: #92400e;
    line-height: 1.35;
}

.ct-map-hint-inline[b-xpl7k8vdvs] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    color: #64748b;
    margin-left: auto;
}

.tc-drop-zone[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    border: 2px dashed #c3caff;
    border-radius: 8px;
    background: #f5f7ff;
    padding: .6rem .75rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    text-align: center;
    position: relative;
    min-height: 70px;
}

.tc-drop-zone:hover[b-xpl7k8vdvs] {
    border-color: #4f5dff;
    background: #eef2ff;
}

.tc-drop-zone-icon[b-xpl7k8vdvs] {
    font-size: 1.35rem;
    color: #4f5dff;
    opacity: .85;
}

.tc-drop-zone-txt[b-xpl7k8vdvs] {
    font-size: .72rem;
    font-weight: 600;
    color: #334155;
}

.tc-drop-zone-hint[b-xpl7k8vdvs] {
    font-size: .6rem;
    color: #94a3b8;
    line-height: 1.3;
}

/* ════════════════════════════════════════════════════════════
   BOTÓN INCIDENCIA — responsive
   ≤1440 px: solo icono (sin texto)
   >1440 px: icono + texto (comportamiento normal)
   ════════════════════════════════════════════════════════════ */
.ct-tl-incidencia-wrap[b-xpl7k8vdvs] {
    display: inline-flex;
    flex-shrink: 0;
}

@media (max-width: 1440px) {
    .ct-tl-incidencia-wrap[b-xpl7k8vdvs]  .rz-button-text {
        display: none !important;
    }

    .ct-tl-incidencia-wrap[b-xpl7k8vdvs]  .rz-button {
        min-width: unset !important;
        padding: 0.25rem 0.4rem !important;
    }
}

/* ════════════════════════════════════════════════════════════
   MAP CONTEXT MENU (right-click)
   ════════════════════════════════════════════════════════════ */
.tc-map-ctx-menu[b-xpl7k8vdvs] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: .15rem;
    min-width: 200px;
}

.tc-map-ctx-hdr[b-xpl7k8vdvs] {
    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #475569;
    padding-bottom: .25rem;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: .15rem;
}

.tc-map-ctx-coords[b-xpl7k8vdvs] {
    font-size: .72rem;
    color: #1e293b;
    font-family: monospace;
    background: #f1f5f9;
    padding: .25rem .4rem;
    border-radius: 4px;
    line-height: 1.4;
}

.tc-map-ctx-btn[b-xpl7k8vdvs] {
    font-size: .78rem;
    font-weight: 600;
    padding: .4rem .6rem;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    transition: background .15s;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.tc-map-ctx-btn--track[b-xpl7k8vdvs] {
    background: #4f5dff;
    color: #fff;
}

.tc-map-ctx-btn--track:hover[b-xpl7k8vdvs] {
    background: #3f4cdf;
}

.tc-map-ctx-btn--incident[b-xpl7k8vdvs] {
    background: #f59e0b;
    color: #fff;
}

.tc-map-ctx-btn--incident:hover[b-xpl7k8vdvs] {
    background: #d97706;
}