@import '_content/LeafletForBlazor/LeafletForBlazor.bundle.scp.css';

/* /Pages/Activity/ActivityIndex.razor.rz.scp.css */
.situation-page[b-4ztwa028jw] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.situation-kpi-row[b-4ztwa028jw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.situation-kpi-card[b-4ztwa028jw] {
    background: #fff;
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border-left: 4px solid transparent;
}

.kpi-total[b-4ztwa028jw] { border-left-color: var(--rs-primary, #631656); }
.kpi-filtered[b-4ztwa028jw] { border-left-color: #3b82f6; }
.kpi-wagons[b-4ztwa028jw] { border-left-color: #16a34a; }

.situation-kpi-icon[b-4ztwa028jw] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.kpi-total .situation-kpi-icon[b-4ztwa028jw] { color: var(--rs-primary, #631656); background: var(--rs-primary-subtle, #f5eaf3); }
.kpi-filtered .situation-kpi-icon[b-4ztwa028jw] { color: #3b82f6; background: #eff6ff; }
.kpi-wagons .situation-kpi-icon[b-4ztwa028jw] { color: #16a34a; background: #f0fdf4; }

.situation-kpi-value[b-4ztwa028jw] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.1;
}

.situation-kpi-label[b-4ztwa028jw] {
    font-size: 0.78rem;
    color: #64748b;
}

.filters-panel[b-4ztwa028jw] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.filters-header[b-4ztwa028jw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid transparent;
    transition: background 0.15s;
}

.filters-header:hover[b-4ztwa028jw] {
    background: #f8fafc;
}

.filters-header.is-expanded[b-4ztwa028jw] {
    border-bottom-color: #e2e8f0;
}

.filters-header-left[b-4ztwa028jw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filters-title[b-4ztwa028jw] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #334155;
}

.filters-badge[b-4ztwa028jw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 0.72rem;
    font-weight: 700;
}

.filters-hint[b-4ztwa028jw] {
    font-size: 0.75rem;
    color: #94a3b8;
}

.filters-body[b-4ztwa028jw] {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.filters-grid[b-4ztwa028jw] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.75rem;
}

.filters-grid-4[b-4ztwa028jw] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.filters-grid-2[b-4ztwa028jw] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.filter-field label[b-4ztwa028jw] {
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    margin-bottom: 0.35rem;
}

.filters-actions[b-4ztwa028jw] {
    display: flex;
    gap: 0.5rem;
    padding-top: 0.25rem;
}

.grid-card[b-4ztwa028jw] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.grid-toolbar[b-4ztwa028jw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e2e8f0;
}

.grid-title[b-4ztwa028jw] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.grid-count[b-4ztwa028jw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 8px;
    border-radius: 11px;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 600;
}

.situation-grid-wrap[b-4ztwa028jw] {
    width: 100%;
    overflow-x: hidden;
}

.situation-grid-wrap[b-4ztwa028jw]  .rz-data-grid {
    border: none;
    border-radius: 0;
}

.situation-grid-wrap[b-4ztwa028jw]  .rz-grid-table {
    table-layout: fixed !important;
    width: 100% !important;
}

.situation-grid-wrap[b-4ztwa028jw]  .rz-grid-table th,
.situation-grid-wrap[b-4ztwa028jw]  .rz-grid-table td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 0;
    font-size: 0.78rem;
}

.situation-grid-wrap[b-4ztwa028jw]  .rz-grid-table th {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
    background: #f8fafc;
}

.situation-cell[b-4ztwa028jw] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.panel-fade-in[b-4ztwa028jw] {
    animation: panel-fade-in-b-4ztwa028jw 0.3s ease-out;
}

@keyframes panel-fade-in-b-4ztwa028jw {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1200px) {
    .filters-grid[b-4ztwa028jw] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .situation-kpi-row[b-4ztwa028jw] {
        grid-template-columns: 1fr;
    }

    .filters-grid[b-4ztwa028jw],
    .filters-grid-4[b-4ztwa028jw],
    .filters-grid-2[b-4ztwa028jw] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Dashboards/Dashboard.razor.rz.scp.css */
/* Railsider Bento Dashboard */
.rs-dashboard[b-hwadjj67xg] {
    --rs-primary: #420134;
    --rs-primary-container: #5d1a4b;
    --rs-secondary: #92407d;
    --rs-secondary-container: #fd9cdf;
    --rs-on-secondary-container: #7b2c69;
    --rs-surface: #f9f9fb;
    --rs-surface-container: #eeeef0;
    --rs-surface-container-high: #e8e8ea;
    --rs-surface-container-low: #f3f3f5;
    --rs-outline-variant: #d5c1ca;
    --rs-on-surface: #1a1c1d;
    --rs-on-surface-variant: #51434a;
    --rs-error: #ba1a1a;
    --rs-error-container: #ffdad6;
    --rs-primary-fixed-dim: #ffade0;

    padding: 1.5rem;
    background: var(--rs-surface);
    min-height: calc(100vh - 48px);
}

.rs-dashboard-hero[b-hwadjj67xg] {
    max-width: 72rem;
    margin: 0 auto 2.5rem;
}

.rs-dashboard-hero h1[b-hwadjj67xg] {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--rs-primary);
    margin: 0 0 0.5rem;
}

.rs-dashboard-hero p[b-hwadjj67xg] {
    font-size: 0.875rem;
    color: var(--rs-on-surface-variant);
    margin: 0 0 2rem;
}

.rs-search-bar[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.5rem;
    padding: 0.35rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    gap: 0.5rem;
}

.rs-search-input-wrap[b-hwadjj67xg] {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 0 1rem;
    gap: 0.75rem;
}

.rs-search-input-wrap .material-icons-round[b-hwadjj67xg] {
    color: #83737b;
    font-size: 20px;
}

.rs-search-input[b-hwadjj67xg] {
    width: 100%;
    border: none;
    outline: none;
    font-size: 0.875rem;
    background: transparent;
    color: var(--rs-on-surface);
}

.rs-search-input[b-hwadjj67xg]::placeholder {
    color: var(--rs-outline-variant);
}

.rs-search-btn[b-hwadjj67xg] {
    background: var(--rs-primary);
    color: #fff;
    border: none;
    border-radius: 0.25rem;
    padding: 0.5rem 1.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: opacity 0.15s;
    white-space: nowrap;
}

.rs-search-btn:hover[b-hwadjj67xg] {
    opacity: 0.9;
}

.rs-bento-grid[b-hwadjj67xg] {
    max-width: 72rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(150px, auto);
    gap: 1rem;
    /* Rellena los huecos que dejan las tarjetas que ocupan 2 columnas (evita celdas vacías). */
    grid-auto-flow: row dense;
}

.rs-bento-large[b-hwadjj67xg] {
    grid-column: span 2;
    grid-row: span 1;
}

.rs-bento-span2[b-hwadjj67xg] {
    grid-column: span 2;
}

.rs-bento-card[b-hwadjj67xg] {
    background: #fff;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.rs-bento-primary[b-hwadjj67xg] {
    background: var(--rs-primary);
    color: #fff;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    min-height: 150px;
    position: relative;
    transition: transform 0.2s, box-shadow 0.2s;
}

.rs-bento-primary:hover[b-hwadjj67xg] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(66, 1, 52, 0.25);
}

.rs-bento-tag[b-hwadjj67xg] {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    background: rgba(255, 255, 255, 0.1);
    color: #d783b9;
    padding: 0.25rem 0.75rem;
    border-radius: 999px;
    margin-bottom: 0.5rem;
}

.rs-bento-primary h2[b-hwadjj67xg] {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 0.35rem;
}

.rs-bento-primary p[b-hwadjj67xg] {
    font-size: 0.8125rem;
    opacity: 0.8;
    max-width: 20rem;
    margin: 0;
    line-height: 1.4;
}

.rs-bento-primary-footer[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.75rem;
}

.rs-bento-primary-footer .material-icons-round.train-icon[b-hwadjj67xg] {
    font-size: 44px;
    opacity: 0.4;
    transition: transform 0.5s;
}

.rs-bento-primary:hover .train-icon[b-hwadjj67xg] {
    transform: scale(1.1);
}

.rs-bento-arrow[b-hwadjj67xg] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: #fff;
    color: var(--rs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s;
}

.rs-bento-primary:hover .rs-bento-arrow[b-hwadjj67xg] {
    transform: translateX(4px);
}

.rs-stat-card[b-hwadjj67xg] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Tarjeta de salud de vagones (clicable) */
.rs-health-card[b-hwadjj67xg] {
    /* Agrupar el contenido arriba (en vez de space-between) para que no quede un hueco
       en medio cuando la tarjeta se estira a la altura de su vecina más alta. */
    justify-content: flex-start;
    gap: 0.85rem;
}

.rs-health-card:hover[b-hwadjj67xg] {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
    transition: transform 0.15s, box-shadow 0.15s;
}

/* Titular positivo: % de GPS operativos */
.rs-health-headline[b-hwadjj67xg] {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
    margin-top: 0.15rem;
}

.rs-health-pct[b-hwadjj67xg] {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

    .rs-health-pct.rs-health-ok[b-hwadjj67xg] { color: #16a34a; }
    .rs-health-pct.rs-health-warn[b-hwadjj67xg] { color: #d97706; }
    .rs-health-pct.rs-health-bad[b-hwadjj67xg] { color: #dc2626; }

.rs-health-headline-sub[b-hwadjj67xg] {
    display: flex;
    flex-direction: column;
    font-size: 0.8rem;
    font-weight: 700;
    color: #374151;
}

.rs-health-headline-meta[b-hwadjj67xg] {
    font-size: 0.68rem;
    font-weight: 500;
    color: #94a3b8;
}

.rs-health-bar[b-hwadjj67xg] {
    margin-top: 0.5rem;
    height: 6px;
    border-radius: 999px;
    background: #eef2f7;
    overflow: hidden;
}

    .rs-health-bar > span[b-hwadjj67xg] {
        display: block;
        height: 100%;
        border-radius: 999px;
        transition: width 0.4s ease;
    }

    .rs-health-bar > span.rs-health-ok[b-hwadjj67xg] { background: #16a34a; }
    .rs-health-bar > span.rs-health-warn[b-hwadjj67xg] { background: #d97706; }
    .rs-health-bar > span.rs-health-bad[b-hwadjj67xg] { background: #dc2626; }

.rs-health-chips[b-hwadjj67xg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.6rem;
}

.rs-health-chip[b-hwadjj67xg] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    font-size: 0.72rem;
    color: #475569;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s, color 0.12s;
}

    .rs-health-chip:hover[b-hwadjj67xg] {
        background: var(--rs-primary-subtle, #f5eaf3);
        border-color: var(--rs-primary, #631656);
        color: var(--rs-primary, #631656);
    }

    .rs-health-chip b[b-hwadjj67xg] { color: #1f2937; }
    .rs-health-chip:hover b[b-hwadjj67xg] { color: var(--rs-primary, #631656); }
    .rs-health-chip .material-icons-round[b-hwadjj67xg] { font-size: 0.95rem; }

.rs-stat-label[b-hwadjj67xg] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-secondary);
    display: block;
    margin-bottom: 0.25rem;
}

.rs-stat-value[b-hwadjj67xg] {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--rs-primary);
}

.rs-stat-meta[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.rs-stat-meta.positive[b-hwadjj67xg] { color: #15803d; }
.rs-stat-meta.neutral[b-hwadjj67xg] { color: rgba(66, 1, 52, 0.5); }
.rs-stat-meta.warning[b-hwadjj67xg] { color: #b45309; }

.rs-stat-meta .material-icons-round[b-hwadjj67xg] {
    font-size: 16px;
}

.rs-panel-header[b-hwadjj67xg] {
    padding: 1rem;
    border-bottom: 1px solid var(--rs-outline-variant);
    background: var(--rs-surface-container-low);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rs-panel-title[b-hwadjj67xg] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-primary);
}

.rs-panel-link[b-hwadjj67xg] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--rs-secondary);
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: none;
}

.rs-panel-link:hover[b-hwadjj67xg] {
    text-decoration: underline;
}

.rs-updates-list[b-hwadjj67xg] {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-height: 280px;
    overflow-y: auto;
}

.rs-updates-list[b-hwadjj67xg]::-webkit-scrollbar { width: 4px; }
.rs-updates-list[b-hwadjj67xg]::-webkit-scrollbar-thumb { background: var(--rs-outline-variant); border-radius: 10px; }

.rs-update-row[b-hwadjj67xg] {
    padding: 0.75rem;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.125rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: border-color 0.15s;
}

.rs-update-row:hover[b-hwadjj67xg] {
    border-color: var(--rs-secondary);
}

.rs-update-plate[b-hwadjj67xg] {
    font-family: 'IBM Plex Mono', 'Consolas', monospace;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--rs-primary);
}

.rs-update-location[b-hwadjj67xg] {
    font-size: 0.5625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--rs-on-surface-variant);
    margin-top: 0.15rem;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rs-update-right[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.rs-badge[b-hwadjj67xg] {
    font-size: 0.625rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 0.125rem;
}

.rs-badge-stopped[b-hwadjj67xg] {
    color: var(--rs-error);
    background: var(--rs-error-container);
}

.rs-badge-moving[b-hwadjj67xg] {
    color: #15803d;
    background: #dcfce7;
}

.rs-map-card[b-hwadjj67xg] {
    position: relative;
    cursor: pointer;
    min-height: 200px;
    overflow: hidden;
}

.rs-map-canvas[b-hwadjj67xg] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 200px;
    z-index: 0;
}

.rs-map-bg[b-hwadjj67xg] {
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        linear-gradient(135deg, #e8f0e8 0%, #d4e4d4 30%, #c8d8c0 60%, #b8c8b0 100%);
}

.rs-map-overlay[b-hwadjj67xg] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, rgba(66, 1, 52, 0.8), transparent 55%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 1.5rem;
    pointer-events: none;
}

.rs-map-overlay .rs-panel-title[b-hwadjj67xg] {
    color: #fff;
    margin-bottom: 0.25rem;
}

.rs-map-overlay h3[b-hwadjj67xg] {
    color: #fff;
    font-weight: 700;
    margin: 0;
    font-size: 1rem;
}

.rs-map-zones[b-hwadjj67xg] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 0.75rem;
}

.rs-map-zone[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.625rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.8);
}

.rs-zone-dot[b-hwadjj67xg] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.rs-map-icon-badge[b-hwadjj67xg] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(4px);
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.25rem;
    padding: 0.5rem;
    color: var(--rs-primary);
}

.rs-action-card[b-hwadjj67xg] {
    padding: 1.5rem;
    background: var(--rs-surface-container-high);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.rs-action-card:hover[b-hwadjj67xg] {
    background: var(--rs-primary);
    color: #fff;
}

.rs-action-card .material-icons-round[b-hwadjj67xg] {
    color: var(--rs-primary);
    transition: color 0.2s;
}

.rs-action-card:hover .material-icons-round[b-hwadjj67xg] {
    color: #fff;
}

.rs-action-card h4[b-hwadjj67xg] {
    font-weight: 700;
    font-size: 0.875rem;
    margin: 0 0 0.25rem;
}

.rs-action-card p[b-hwadjj67xg] {
    font-size: 0.75rem;
    opacity: 0.7;
    margin: 0;
}


/* Skeletons */
.rs-skeleton[b-hwadjj67xg] {
    background: linear-gradient(90deg, #eceff3 25%, #dde3ea 37%, #eceff3 63%);
    background-size: 400% 100%;
    animation: rs-shimmer-b-hwadjj67xg 1.2s ease-in-out infinite;
    border-radius: 0.25rem;
}

.rs-skeleton-value[b-hwadjj67xg] {
    height: 2rem;
    width: 4rem;
}

.rs-skeleton-label[b-hwadjj67xg] {
    height: 0.75rem;
    width: 6rem;
    margin-top: 0.5rem;
}

.rs-skeleton-row[b-hwadjj67xg] {
    height: 3.5rem;
    width: 100%;
}

.rs-skeleton-map[b-hwadjj67xg] {
    height: 200px;
    width: 100%;
}

@keyframes rs-shimmer-b-hwadjj67xg {
    0% { background-position: 100% 0; }
    100% { background-position: 0 0; }
}

.rs-empty-msg[b-hwadjj67xg] {
    padding: 1.5rem;
    text-align: center;
    color: var(--rs-on-surface-variant);
    font-size: 0.875rem;
}

@media (max-width: 1024px) {
    .rs-bento-grid[b-hwadjj67xg] {
        grid-template-columns: repeat(2, 1fr);
    }

    .rs-bento-large[b-hwadjj67xg] {
        grid-column: span 2;
        grid-row: span 1;
    }
}

@media (max-width: 640px) {
    .rs-dashboard[b-hwadjj67xg] {
        padding: 1rem;
    }

    .rs-bento-grid[b-hwadjj67xg] {
        grid-template-columns: 1fr;
    }

    .rs-bento-large[b-hwadjj67xg],
    .rs-bento-span2[b-hwadjj67xg] {
        grid-column: span 1;
    }

    .rs-search-bar[b-hwadjj67xg] {
        flex-direction: column;
        align-items: stretch;
    }

    .rs-search-btn[b-hwadjj67xg] {
        width: 100%;
        padding: 0.75rem;
    }
}

/* ===== Sección Lanzaderas ===== */
/* ── Lanzaderas: barra compacta colapsable ───────────────── */

.rs-lz-section[b-hwadjj67xg] {
    /* Tarjeta a todo el ancho: primera fila del bento (ocupa todas las columnas del grid). */
    grid-column: 1 / -1;
    border-radius: 0.5rem;
    background: #fff;
    border: 1px solid var(--rs-outline-variant);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.rs-lz-bar[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
    flex-wrap: wrap;
}

.rs-lz-bar-toggle[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem 0;
    color: inherit;
}

.rs-lz-bar-icon[b-hwadjj67xg] {
    font-size: 1.4rem;
    color: var(--rs-primary, #420134);
}

.rs-lz-bar-title[b-hwadjj67xg] {
    font-size: 0.95rem;
    font-weight: 800;
    color: #1f2937;
}

.rs-lz-bar-chips[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: 0.25rem;
}

.rs-lz-chip[b-hwadjj67xg] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    background: #fff;
    border: 1px solid var(--rs-outline-variant, #d5c1ca);
    color: #374151;
    white-space: nowrap;
}

.rs-lz-chip-danger[b-hwadjj67xg] { background: #fef2f2; border-color: #fecaca; color: #dc2626; }
.rs-lz-chip-warn[b-hwadjj67xg]   { background: #fffbeb; border-color: #fde68a; color: #b45309; }

.rs-lz-chevron[b-hwadjj67xg] {
    font-size: 1.3rem;
    color: #9ca3af;
    transition: transform .2s;
}

.rs-lz-bar-actions[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.rs-lz-arrow[b-hwadjj67xg] {
    border: 1px solid var(--rs-outline-variant, #d5c1ca);
    background: #fff;
    color: #475569;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s, color .15s;
}

.rs-lz-arrow:hover[b-hwadjj67xg] { background: var(--rs-secondary-container, #fd9cdf); color: var(--rs-primary, #420134); }

.rs-lz-weeklabel[b-hwadjj67xg] {
    font-weight: 700;
    font-size: 0.78rem;
    color: #1f2937;
    min-width: 150px;
    text-align: center;
}

.rs-lz-today[b-hwadjj67xg] {
    border: 1px solid var(--rs-outline-variant, #d5c1ca);
    background: #fff;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    height: 30px;
    padding: 0 0.65rem;
    border-radius: 8px;
    cursor: pointer;
}

.rs-lz-today:hover[b-hwadjj67xg] { background: var(--rs-secondary-container, #fd9cdf); color: var(--rs-primary, #420134); }

.rs-lz-all[b-hwadjj67xg] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-weight: 700;
    font-size: 0.78rem;
    color: var(--rs-primary, #420134);
    text-decoration: none;
    padding: 0 0.4rem;
}

.rs-lz-all .material-icons-round[b-hwadjj67xg] { font-size: 0.95rem; }

/* ── Detalle expandido ───────────────────────────────────── */

.rs-lz-detail[b-hwadjj67xg] {
    padding: 0.75rem 1rem 1rem;
    border-top: 1px solid var(--rs-outline-variant, #d5c1ca);
}

.rs-lz-grid[b-hwadjj67xg] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 0.85rem;
}

.rs-lz-empty[b-hwadjj67xg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
    padding: 1.5rem;
    color: #6b7280;
    font-size: 0.85rem;
}

.rs-lz-empty .material-icons-round[b-hwadjj67xg] { font-size: 1.4rem; opacity: 0.5; }
.rs-lz-empty a[b-hwadjj67xg] { color: var(--rs-primary, #420134); font-weight: 700; }
/* /Pages/Feedback/FeedbackAdminIndex.razor.rz.scp.css */
/* ============================================
   FeedbackAdminIndex — Scoped CSS
   Design system aligned with Users.razor.css
   ============================================ */

/* Skeleton */
.skeleton[b-euxebqj4od] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-euxebqj4od 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-euxebqj4od {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.panel-fade-in[b-euxebqj4od] {
    animation: panel-fade-in-b-euxebqj4od 0.3s ease-out;
}

@keyframes panel-fade-in-b-euxebqj4od {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== KPI ROWS ===== */
.fb-kpi-row[b-euxebqj4od] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.fb-kpi-row + .fb-kpi-row[b-euxebqj4od] {
    margin-bottom: 1.25rem;
}

.fb-kpi-card[b-euxebqj4od] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-left: 4px solid transparent;
    transition: box-shadow 0.2s, transform 0.15s;
}

.fb-kpi-card:hover[b-euxebqj4od] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    transform: translateY(-2px);
}

/* KPI color variants */
.kpi-total[b-euxebqj4od]       { border-left-color: var(--rs-primary, #631656); }
.kpi-pendientes[b-euxebqj4od]  { border-left-color: #f59e0b; }
.kpi-revision[b-euxebqj4od]    { border-left-color: #3b82f6; }
.kpi-resueltos[b-euxebqj4od]   { border-left-color: #16a34a; }
.kpi-descartados[b-euxebqj4od] { border-left-color: #64748b; }
.kpi-criticos[b-euxebqj4od]    { border-left-color: #ef4444; }
.kpi-bugs[b-euxebqj4od]        { border-left-color: #dc2626; }
.kpi-sugerencias[b-euxebqj4od] { border-left-color: #2563eb; }

.fb-kpi-icon[b-euxebqj4od] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.kpi-total .fb-kpi-icon[b-euxebqj4od]       { color: var(--rs-primary, #631656); background: var(--rs-primary-subtle, #f5eaf3); }
.kpi-pendientes .fb-kpi-icon[b-euxebqj4od]  { color: #f59e0b; background: #fffbeb; }
.kpi-revision .fb-kpi-icon[b-euxebqj4od]    { color: #3b82f6; background: #eff6ff; }
.kpi-resueltos .fb-kpi-icon[b-euxebqj4od]   { color: #16a34a; background: #f0fdf4; }
.kpi-descartados .fb-kpi-icon[b-euxebqj4od] { color: #64748b; background: #f8fafc; }
.kpi-criticos .fb-kpi-icon[b-euxebqj4od]    { color: #ef4444; background: #fef2f2; }
.kpi-bugs .fb-kpi-icon[b-euxebqj4od]        { color: #dc2626; background: #fef2f2; }
.kpi-sugerencias .fb-kpi-icon[b-euxebqj4od] { color: #2563eb; background: #eff6ff; }

.fb-kpi-content[b-euxebqj4od] {
    display: flex;
    flex-direction: column;
}

.fb-kpi-value[b-euxebqj4od] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.1;
}

.fb-kpi-label[b-euxebqj4od] {
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}

/* Skeleton KPIs */
.skeleton-kpi[b-euxebqj4od] {
    height: 72px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* ===== ERROR BANNER ===== */
.fb-error-banner[b-euxebqj4od] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.625rem 0.875rem;
    margin-bottom: 1.25rem;
    color: #dc2626;
    font-size: 0.8rem;
    font-weight: 500;
    animation: shake-b-euxebqj4od 0.3s ease;
}

@keyframes shake-b-euxebqj4od {
    0%, 100% { transform: translateX(0); }
    25%      { transform: translateX(-4px); }
    75%      { transform: translateX(4px); }
}

.fb-error-icon[b-euxebqj4od] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ===== SEARCH BAR ===== */
.fb-search-bar[b-euxebqj4od] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 0.875rem 1.25rem;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.search-input-wrapper[b-euxebqj4od] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 200px;
}

.search-icon[b-euxebqj4od] {
    color: #94a3b8;
    font-size: 1.2rem;
}

.search-filters[b-euxebqj4od] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ===== DATA GRID CARD ===== */
.fb-grid-card[b-euxebqj4od] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 0.25rem 0;
    overflow: hidden;
}

/* ===== USER CELL ===== */
.fb-user-cell[b-euxebqj4od] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.fb-user-avatar[b-euxebqj4od] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rs-primary, #631656), var(--rs-primary-light, #8b3d7c));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 0.72rem;
    flex-shrink: 0;
    letter-spacing: 0.5px;
}

.fb-user-info[b-euxebqj4od] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.fb-user-name[b-euxebqj4od] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fb-user-url[b-euxebqj4od] {
    font-size: 0.72rem;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

/* ===== MODULE TAG ===== */
.fb-module-tag[b-euxebqj4od] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 0.68rem;
    font-weight: 600;
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
    line-height: 1.5;
}

.fb-module-tag-icon[b-euxebqj4od] {
    font-size: 0.72rem;
    flex-shrink: 0;
}

/* ===== CATEGORY BADGE ===== */
.fb-badge[b-euxebqj4od] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.badge-bug[b-euxebqj4od]        { background: #fef2f2; color: #dc2626; }
.badge-sugerencia[b-euxebqj4od] { background: #eff6ff; color: #2563eb; }
.badge-mejora[b-euxebqj4od]     { background: #f0fdf4; color: #16a34a; }
.badge-otro[b-euxebqj4od]       { background: #f8fafc; color: #64748b; }

/* ===== COMMENT TEXT ===== */
.fb-comment-text[b-euxebqj4od] {
    color: #64748b;
    font-size: 0.8rem;
    line-height: 1.4;
}

/* ===== DATE DISPLAY ===== */
.fb-date[b-euxebqj4od] {
    font-size: 0.8rem;
    color: #64748b;
}

/* ===== NOTES ICON ===== */
.fb-notes-icon[b-euxebqj4od] {
    font-size: 1rem;
    color: var(--rs-primary, #631656);
}

/* ===== ACTION BUTTONS ===== */
.fb-action-btn-group[b-euxebqj4od] {
    display: flex;
    gap: 4px;
}

/* ===== EMPTY STATE ===== */
.fb-empty-state[b-euxebqj4od] {
    text-align: center;
    padding: 3rem 1rem;
}

.fb-empty-icon[b-euxebqj4od] {
    font-size: 3rem;
    color: #d1d5db;
    display: block;
    margin-bottom: 0.75rem;
}

.fb-empty-title[b-euxebqj4od] {
    font-size: 1rem;
    font-weight: 600;
    color: #64748b;
    margin: 0 0 0.25rem;
}

.fb-empty-sub[b-euxebqj4od] {
    font-size: 0.85rem;
    color: #94a3b8;
    margin: 0;
}

/* ===== SKELETON STATES ===== */
.skeleton-search[b-euxebqj4od] {
    height: 56px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin-bottom: 1.25rem;
}

.skeleton-grid[b-euxebqj4od] {
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    padding: 1rem 0;
}

.skeleton-grid-row[b-euxebqj4od] {
    height: 52px;
    margin: 0.5rem 1rem;
    border-radius: 6px;
}

/* ===== TABS ===== */
[b-euxebqj4od] .rz-tabview {
    border: none;
}

[b-euxebqj4od] .rz-tabview-nav {
    border-bottom: 2px solid #e5e7eb;
    padding: 0 1rem;
    gap: 0;
}

[b-euxebqj4od] .rz-tabview-nav li .rz-tabview-nav-link {
    font-size: 0.82rem;
    font-weight: 600;
    color: #64748b;
    padding: 0.75rem 1rem;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
}

[b-euxebqj4od] .rz-tabview-nav li .rz-tabview-nav-link:hover {
    color: #334155;
}

[b-euxebqj4od] .rz-tabview-nav li.rz-tabview-selected .rz-tabview-nav-link {
    color: var(--rs-primary, #631656);
    border-bottom-color: var(--rs-primary, #631656);
}

[b-euxebqj4od] .rz-tabview-panels {
    padding: 0;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .fb-kpi-row[b-euxebqj4od] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .fb-kpi-row[b-euxebqj4od] {
        grid-template-columns: 1fr;
    }

    .fb-search-bar[b-euxebqj4od] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-filters[b-euxebqj4od] {
        justify-content: flex-end;
    }
}
/* /Pages/Feedback/FeedbackDetailDialog.razor.rz.scp.css */
/* ============================================
   FeedbackDetailDialog — Scoped CSS
   Design system aligned with EditUserDialog.razor.css
   ============================================ */

/* Container */
.dialog-container[b-msavijak13] {
    padding: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ===== HEADER GRID ===== */
.detail-header-grid[b-msavijak13] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* ===== USER CARD ===== */
.detail-user-card[b-msavijak13] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 0.875rem 1rem;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.detail-user-avatar[b-msavijak13] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rs-primary, #631656), var(--rs-primary-light, #8b3d7c));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    flex-shrink: 0;
    letter-spacing: 0.5px;
}

.detail-user-info[b-msavijak13] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.detail-user-name[b-msavijak13] {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.95rem;
}

.detail-user-date[b-msavijak13] {
    font-size: 0.8rem;
    color: #94a3b8;
    margin-top: 2px;
}

.detail-module-tag[b-msavijak13] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 600;
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    margin-top: 4px;
    white-space: nowrap;
}

.detail-module-tag-icon[b-msavijak13] {
    font-size: 0.78rem;
    flex-shrink: 0;
}

.detail-user-url[b-msavijak13] {
    font-size: 0.72rem;
    color: #94a3b8;
    margin-top: 3px;
    word-break: break-all;
}

/* ===== BADGES CARD ===== */
.detail-badges-card[b-msavijak13] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-badges-row[b-msavijak13] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

/* ===== BADGE BASE ===== */
.fb-badge[b-msavijak13] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}

/* Category badges */
.badge-bug[b-msavijak13]        { background: #fef2f2; color: #dc2626; }
.badge-sugerencia[b-msavijak13] { background: #eff6ff; color: #2563eb; }
.badge-mejora[b-msavijak13]     { background: #f0fdf4; color: #16a34a; }
.badge-otro[b-msavijak13]       { background: #f8fafc; color: #64748b; }

/* Priority badges */
.badge-critica[b-msavijak13]     { background: #fef2f2; color: #dc2626; }
.badge-alta[b-msavijak13]        { background: #fff7ed; color: #ea580c; }
.badge-media[b-msavijak13]       { background: #fffbeb; color: #d97706; }
.badge-baja[b-msavijak13]        { background: #eff6ff; color: #2563eb; }
.badge-sin-asignar[b-msavijak13] { background: #f8fafc; color: #94a3b8; }

/* Status badges */
.badge-resuelto[b-msavijak13]    { background: #f0fdf4; color: #16a34a; }
.badge-en-revision[b-msavijak13] { background: #eff6ff; color: #2563eb; }
.badge-descartado[b-msavijak13]  { background: #f8fafc; color: #64748b; }
.badge-pendiente[b-msavijak13]   { background: #fffbeb; color: #d97706; }

/* ===== ADMIN METADATA ===== */
.detail-admin-meta[b-msavijak13] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    color: #94a3b8;
}

.detail-admin-meta-icon[b-msavijak13] {
    font-size: 0.95rem;
}

.detail-admin-meta-separator[b-msavijak13] {
    color: #cbd5e1;
}

/* ===== COMMENT SECTION ===== */
.detail-comment-card[b-msavijak13] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

.detail-section-label[b-msavijak13] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
    margin-bottom: 0.625rem;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.detail-section-label-icon[b-msavijak13] {
    font-size: 0.875rem;
}

.detail-comment-text[b-msavijak13] {
    margin: 0;
    color: #1e293b;
    font-size: 0.875rem;
    line-height: 1.65;
    white-space: pre-wrap;
}

/* ===== ADMIN NOTES SECTION ===== */
.detail-notes-section[b-msavijak13] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* ===== ERROR ALERT ===== */
.error-alert[b-msavijak13] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.625rem 0.875rem;
    color: #dc2626;
    font-size: 0.8rem;
    font-weight: 500;
    animation: shake-b-msavijak13 0.3s ease;
}

@keyframes shake-b-msavijak13 {
    0%, 100% { transform: translateX(0); }
    25%      { transform: translateX(-4px); }
    75%      { transform: translateX(4px); }
}

.error-alert-icon[b-msavijak13] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ===== DIALOG FOOTER ===== */
.dialog-footer[b-msavijak13] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f1f5f9;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 600px) {
    .detail-header-grid[b-msavijak13] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Feedback/FeedbackMyIndex.razor.rz.scp.css */
/* Reutiliza el design system de FeedbackAdminIndex */

.skeleton[b-q4tkfgvv97] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-q4tkfgvv97 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-q4tkfgvv97 {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.panel-fade-in[b-q4tkfgvv97] {
    animation: panel-fade-in-b-q4tkfgvv97 0.3s ease-out;
}

@keyframes panel-fade-in-b-q4tkfgvv97 {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.skeleton-kpi[b-q4tkfgvv97] {
    height: 72px;
}

.skeleton-search[b-q4tkfgvv97] {
    height: 52px;
    margin-bottom: 1rem;
}

.skeleton-grid-row[b-q4tkfgvv97] {
    height: 48px;
    margin-bottom: 0.5rem;
}

.fb-kpi-row[b-q4tkfgvv97] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.fb-kpi-card[b-q4tkfgvv97] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-left: 4px solid transparent;
}

.kpi-total[b-q4tkfgvv97]       { border-left-color: var(--rs-primary, #631656); }
.kpi-pendientes[b-q4tkfgvv97]  { border-left-color: #f59e0b; }
.kpi-revision[b-q4tkfgvv97]    { border-left-color: #3b82f6; }
.kpi-resueltos[b-q4tkfgvv97]   { border-left-color: #16a34a; }
.kpi-descartados[b-q4tkfgvv97] { border-left-color: #64748b; }

.fb-kpi-icon[b-q4tkfgvv97] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.kpi-total .fb-kpi-icon[b-q4tkfgvv97]      { color: var(--rs-primary, #631656); background: var(--rs-primary-subtle, #f5eaf3); }
.kpi-pendientes .fb-kpi-icon[b-q4tkfgvv97] { color: #f59e0b; background: #fffbeb; }
.kpi-revision .fb-kpi-icon[b-q4tkfgvv97]   { color: #3b82f6; background: #eff6ff; }
.kpi-resueltos .fb-kpi-icon[b-q4tkfgvv97]  { color: #16a34a; background: #f0fdf4; }
.kpi-descartados .fb-kpi-icon[b-q4tkfgvv97] { color: #64748b; background: #f1f5f9; }

.fb-kpi-content[b-q4tkfgvv97] {
    display: flex;
    flex-direction: column;
}

.fb-kpi-value[b-q4tkfgvv97] {
    font-size: 1.4rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.1;
}

.fb-kpi-label[b-q4tkfgvv97] {
    font-size: 0.78rem;
    color: #64748b;
}

.my-feedback-intro[b-q4tkfgvv97] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.875rem 1rem;
    margin-bottom: 1.25rem;
}

.my-feedback-intro-icon[b-q4tkfgvv97] {
    color: #3b82f6;
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.my-feedback-intro p[b-q4tkfgvv97] {
    margin: 0;
    font-size: 0.875rem;
    color: #475569;
    line-height: 1.5;
}

.fb-error-banner[b-q4tkfgvv97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    color: #dc2626;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.fb-search-bar[b-q4tkfgvv97] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    background: #fff;
    border-radius: 10px;
    padding: 0.75rem 1rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    margin-bottom: 1rem;
}

.search-input-wrapper[b-q4tkfgvv97] {
    flex: 1;
    min-width: 220px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0 0.75rem;
}

.search-icon[b-q4tkfgvv97] {
    color: #94a3b8;
    font-size: 1.1rem;
}

.search-filters[b-q4tkfgvv97] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.fb-grid-card[b-q4tkfgvv97] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    padding: 1rem;
}

.fb-empty-state[b-q4tkfgvv97] {
    text-align: center;
    padding: 3rem 1.5rem;
}

.fb-empty-icon[b-q4tkfgvv97] {
    font-size: 3rem;
    color: #cbd5e1;
    display: block;
    margin-bottom: 0.75rem;
}

.fb-empty-title[b-q4tkfgvv97] {
    font-size: 1rem;
    font-weight: 600;
    color: #475569;
    margin: 0 0 0.35rem;
}

.fb-empty-sub[b-q4tkfgvv97] {
    font-size: 0.875rem;
    color: #94a3b8;
    margin: 0;
}

.fb-badge[b-q4tkfgvv97] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.badge-bug[b-q4tkfgvv97]        { background: #fef2f2; color: #dc2626; }
.badge-sugerencia[b-q4tkfgvv97] { background: #eff6ff; color: #2563eb; }
.badge-mejora[b-q4tkfgvv97]     { background: #f0fdf4; color: #16a34a; }
.badge-otro[b-q4tkfgvv97]       { background: #f1f5f9; color: #64748b; }
.badge-pendiente[b-q4tkfgvv97]  { background: #fffbeb; color: #d97706; }
.badge-en-revision[b-q4tkfgvv97] { background: #eff6ff; color: #2563eb; }
.badge-resuelto[b-q4tkfgvv97]   { background: #f0fdf4; color: #16a34a; }
.badge-descartado[b-q4tkfgvv97] { background: #f1f5f9; color: #64748b; }

.fb-module-tag[b-q4tkfgvv97] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #4340d2;
    background: #eef2ff;
    padding: 2px 8px;
    border-radius: 6px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fb-module-tag-icon[b-q4tkfgvv97] {
    font-size: 14px !important;
}

.fb-user-url[b-q4tkfgvv97] {
    font-size: 0.8rem;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    max-width: 180px;
}

.fb-comment-text[b-q4tkfgvv97] {
    font-size: 0.85rem;
    color: #334155;
}

@media (max-width: 1100px) {
    .fb-kpi-row[b-q4tkfgvv97] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 700px) {
    .fb-kpi-row[b-q4tkfgvv97] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Pages/Feedback/FeedbackUserDetailDialog.razor.rz.scp.css */
.dialog-container[b-qi2979ca3c] {
    padding: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.detail-status-tracker[b-qi2979ca3c] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 1rem;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
}

.status-step[b-qi2979ca3c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    min-width: 80px;
}

.status-step-icon[b-qi2979ca3c] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.2s;
}

.status-step.pending .status-step-icon[b-qi2979ca3c] {
    background: #f1f5f9;
    color: #94a3b8;
    border: 2px solid #e2e8f0;
}

.status-step.completed .status-step-icon[b-qi2979ca3c] {
    background: var(--rs-primary, #631656);
    color: #fff;
    border: 2px solid var(--rs-primary, #631656);
}

.status-step-label[b-qi2979ca3c] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    text-align: center;
}

.status-step.completed .status-step-label[b-qi2979ca3c] {
    color: #1e293b;
}

.status-step-connector[b-qi2979ca3c] {
    flex: 1;
    height: 2px;
    background: #e2e8f0;
    min-width: 24px;
    max-width: 48px;
    margin-bottom: 1.25rem;
}

.status-step-connector.completed[b-qi2979ca3c] {
    background: var(--rs-primary, #631656);
}

.detail-meta-card[b-qi2979ca3c] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-badges-row[b-qi2979ca3c] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.fb-badge[b-qi2979ca3c] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

.badge-bug[b-qi2979ca3c]        { background: #fef2f2; color: #dc2626; }
.badge-sugerencia[b-qi2979ca3c] { background: #eff6ff; color: #2563eb; }
.badge-mejora[b-qi2979ca3c]     { background: #f0fdf4; color: #16a34a; }
.badge-otro[b-qi2979ca3c]       { background: #f1f5f9; color: #64748b; }
.badge-pendiente[b-qi2979ca3c]  { background: #fffbeb; color: #d97706; }
.badge-en-revision[b-qi2979ca3c] { background: #eff6ff; color: #2563eb; }
.badge-resuelto[b-qi2979ca3c]   { background: #f0fdf4; color: #16a34a; }
.badge-descartado[b-qi2979ca3c] { background: #f1f5f9; color: #64748b; }
.badge-critica[b-qi2979ca3c]    { background: #fef2f2; color: #dc2626; }
.badge-alta[b-qi2979ca3c]       { background: #fff7ed; color: #ea580c; }
.badge-media[b-qi2979ca3c]      { background: #fffbeb; color: #d97706; }
.badge-baja[b-qi2979ca3c]       { background: #f0fdf4; color: #16a34a; }
.badge-sin-asignar[b-qi2979ca3c] { background: #f1f5f9; color: #64748b; }

.detail-dates[b-qi2979ca3c] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.detail-date-item[b-qi2979ca3c] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: #64748b;
}

.detail-date-icon[b-qi2979ca3c] {
    font-size: 16px !important;
    color: #94a3b8;
}

.detail-module[b-qi2979ca3c],
.detail-page-url[b-qi2979ca3c] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: #475569;
}

.detail-module-icon[b-qi2979ca3c],
.detail-page-icon[b-qi2979ca3c] {
    font-size: 16px !important;
    color: #94a3b8;
    flex-shrink: 0;
}

.detail-page-url span:last-child[b-qi2979ca3c] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-comment-card[b-qi2979ca3c] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
}

.detail-section-label[b-qi2979ca3c] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.75rem;
}

.detail-section-label-icon[b-qi2979ca3c] {
    font-size: 16px !important;
}

.detail-comment-text[b-qi2979ca3c] {
    margin: 0;
    font-size: 0.95rem;
    color: #1e293b;
    line-height: 1.6;
    white-space: pre-wrap;
}

.detail-footer-note[b-qi2979ca3c] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: #64748b;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    padding: 0.75rem 1rem;
}

.detail-footer-note .material-icons-round[b-qi2979ca3c] {
    font-size: 18px;
    color: #16a34a;
    flex-shrink: 0;
}

.dialog-footer[b-qi2979ca3c] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.5rem;
    border-top: 1px solid #f3f4f6;
}
/* /Pages/Health/WagonHealthIndex.razor.rz.scp.css */
.wagon-health-card[b-s4gpq7lyn6] {
    max-width: 1600px;
}

/* ===== Topbar ===== */
.index-topbar[b-s4gpq7lyn6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.topbar-title[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.topbar-title > .material-icons-round[b-s4gpq7lyn6] {
    font-size: 2rem;
    color: var(--rs-primary, #631656);
}

.topbar-title-text[b-s4gpq7lyn6] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.topbar-title-main[b-s4gpq7lyn6] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #111827;
}

.topbar-title-sub[b-s4gpq7lyn6] {
    font-size: 0.8rem;
    color: #6b7280;
}

.index-topbar-actions[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.deep-toggle[b-s4gpq7lyn6] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    user-select: none;
}

/* ===== Skeletons ===== */
.skeleton[b-s4gpq7lyn6] {
    display: block;
    border-radius: 8px;
    background: linear-gradient(90deg, #eef1f6 25%, #f8fafc 50%, #eef1f6 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-s4gpq7lyn6 1.4s ease-in-out infinite;
}

@keyframes skeleton-shimmer-b-s4gpq7lyn6 {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

.skeleton-card[b-s4gpq7lyn6] { cursor: default !important; pointer-events: none; }
.skeleton-icon[b-s4gpq7lyn6] { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; }
.skeleton-line[b-s4gpq7lyn6] { height: 16px; margin: 3px 0; }
.skeleton-thin[b-s4gpq7lyn6] { height: 11px; }

.loading-hint[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6b7280;
    padding: 0.5rem 0.25rem;
}

.spin[b-s4gpq7lyn6] { animation: rotate-b-s4gpq7lyn6 1.1s linear infinite; color: var(--rs-primary, #631656); }
@keyframes rotate-b-s4gpq7lyn6 { to { transform: rotate(360deg); } }

/* ===== KPIs ===== */
.kpi-row[b-s4gpq7lyn6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.75rem;
}

.kpi-card[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
    position: relative;
    overflow: hidden;
}

.kpi-card[b-s4gpq7lyn6]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--rs-primary, #631656);
}

.kpi-icon[b-s4gpq7lyn6] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--rs-primary, #631656);
    color: #fff;
    flex: 0 0 auto;
}

.kpi-icon .material-icons-round[b-s4gpq7lyn6] { font-size: 1.3rem; }

.kpi-body[b-s4gpq7lyn6] { display: flex; flex-direction: column; line-height: 1.15; }

.kpi-value[b-s4gpq7lyn6] {
    font-size: 1.45rem;
    font-weight: 800;
    color: #111827;
    font-family: 'IBM Plex Mono', monospace;
}

.kpi-label[b-s4gpq7lyn6] {
    font-size: 0.72rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.kpi-card.kpi-red[b-s4gpq7lyn6]::before { background: #dc2626; }
.kpi-card.kpi-red .kpi-icon[b-s4gpq7lyn6] { background: #dc2626; }

.kpi-card.kpi-amber[b-s4gpq7lyn6]::before { background: #d97706; }
.kpi-card.kpi-amber .kpi-icon[b-s4gpq7lyn6] { background: #d97706; }

.kpi-card.kpi-blue[b-s4gpq7lyn6]::before { background: #1d4ed8; }
.kpi-card.kpi-blue .kpi-icon[b-s4gpq7lyn6] { background: #1d4ed8; }

.kpi-card.kpi-purple[b-s4gpq7lyn6]::before { background: #7e22ce; }
.kpi-card.kpi-purple .kpi-icon[b-s4gpq7lyn6] { background: #7e22ce; }

/* ===== Filtros (chips) ===== */
.filter-chips[b-s4gpq7lyn6] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.chip[b-s4gpq7lyn6] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.4rem 0.8rem;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.chip .material-icons-round[b-s4gpq7lyn6] { font-size: 1rem; }

.chip:hover[b-s4gpq7lyn6] {
    border-color: var(--rs-primary-light, #8b3d7c);
    background: var(--rs-primary-subtle, #f5eaf3);
}

.chip-count[b-s4gpq7lyn6] {
    background: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 800;
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
}

.chip-active[b-s4gpq7lyn6] {
    background: var(--rs-primary, #631656);
    color: #fff;
    border-color: var(--rs-primary, #631656);
}

.chip-active .chip-count[b-s4gpq7lyn6] {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

.chip-gps.chip-active[b-s4gpq7lyn6] { background: #475569; border-color: #475569; }
.chip-batlow.chip-active[b-s4gpq7lyn6] { background: #d97706; border-color: #d97706; }
.chip-batdrop.chip-active[b-s4gpq7lyn6] { background: #b45309; border-color: #b45309; }
.chip-stuck.chip-active[b-s4gpq7lyn6] { background: #0e7490; border-color: #0e7490; }

/* ===== Grid ===== */
.health-grid[b-s4gpq7lyn6] {
    border-radius: 12px;
    overflow: hidden;
}

.sev-badge[b-s4gpq7lyn6] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.22rem 0.6rem;
    border-radius: 999px;
}

.sev-critical[b-s4gpq7lyn6] { background: #fee2e2; color: #b91c1c; }
.sev-warning[b-s4gpq7lyn6] { background: #fef3c7; color: #b45309; }
.sev-info[b-s4gpq7lyn6] { background: #e0f2fe; color: #0369a1; }

.type-pill[b-s4gpq7lyn6] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.76rem;
    font-weight: 700;
    padding: 0.22rem 0.55rem;
    border-radius: 8px;
    white-space: nowrap;
}

.type-pill .material-icons-round[b-s4gpq7lyn6] { font-size: 0.95rem; }

.type-gpsobsoleto[b-s4gpq7lyn6] { background: #f1f5f9; color: #475569; }
.type-bateriabaja[b-s4gpq7lyn6] { background: #fef3c7; color: #b45309; }
.type-bateriacaida[b-s4gpq7lyn6] { background: #ffedd5; color: #9a3412; }
.type-parado[b-s4gpq7lyn6] { background: #cffafe; color: #0e7490; }

.plate-cell[b-s4gpq7lyn6] {
    font-weight: 800;
    color: #111827;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
}

.plate-type[b-s4gpq7lyn6] {
    display: block;
    font-size: 0.68rem;
    color: #94a3b8;
    font-weight: 600;
}

.detail-msg[b-s4gpq7lyn6] {
    color: #374151;
    font-size: 0.84rem;
}

.detail-addr[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #94a3b8;
    margin-top: 2px;
}

.detail-addr .material-icons-round[b-s4gpq7lyn6] { font-size: 0.85rem; }

.value-cell[b-s4gpq7lyn6] {
    font-weight: 800;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
    color: #1f2937;
}

.gps-date[b-s4gpq7lyn6] {
    font-size: 0.78rem;
    color: #475569;
    font-family: 'IBM Plex Mono', monospace;
}

.gps-none[b-s4gpq7lyn6] { color: #cbd5e1; font-style: italic; }

.row-actions[b-s4gpq7lyn6] {
    display: flex;
    gap: 0.3rem;
}

/* ===== Footer ===== */
.report-footer[b-s4gpq7lyn6] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: #94a3b8;
    padding-top: 0.4rem;
}

.report-footer .material-icons-round[b-s4gpq7lyn6] { font-size: 1rem; }

.footer-warn[b-s4gpq7lyn6] { color: #b45309; font-weight: 600; }

/* ===== Vacío ===== */
.index-empty[b-s4gpq7lyn6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 3.5rem 1.5rem;
    text-align: center;
}

.index-empty > .material-icons-round[b-s4gpq7lyn6] {
    font-size: 3.4rem;
    color: #16a34a;
    opacity: 0.5;
}

.empty-title[b-s4gpq7lyn6] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #374151;
}

.empty-sub[b-s4gpq7lyn6] {
    font-size: 0.88rem;
    color: #6b7280;
    max-width: 460px;
}

/* ===== Accesibilidad ===== */
@media (prefers-reduced-motion: reduce) {
    .skeleton[b-s4gpq7lyn6], .spin[b-s4gpq7lyn6] { animation: none !important; }
    .chip[b-s4gpq7lyn6] { transition: none !important; }
}
/* /Pages/Lanzaderas/CloneRotacionDialog.razor.rz.scp.css */
.clone-dialog[b-0xd3jrxmoj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.25rem;
}

/* ===== Origen ===== */
.clone-source[b-0xd3jrxmoj] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 1rem;
    border-radius: 12px;
    background: var(--rs-primary-subtle, #f5eaf3);
    border: 1px solid #ece0ea;
    border-left: 4px solid var(--c, var(--rs-primary, #631656));
}

.clone-source-icon[b-0xd3jrxmoj] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--c, var(--rs-primary, #631656));
    color: #fff;
    flex: 0 0 auto;
}

.clone-source-icon .material-icons-round[b-0xd3jrxmoj] { font-size: 1.2rem; }

.clone-source-body[b-0xd3jrxmoj] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.clone-source-day[b-0xd3jrxmoj] {
    font-size: 0.92rem;
    color: #1f2937;
}

.clone-source-day strong[b-0xd3jrxmoj] { font-weight: 800; }

.clone-source-route[b-0xd3jrxmoj] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.8rem;
    color: #6b7280;
    font-weight: 600;
}

.clone-source-route .material-icons-round[b-0xd3jrxmoj] { font-size: 0.95rem; }

/* ===== Secciones ===== */
.clone-section-label[b-0xd3jrxmoj] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
}

/* ===== Acciones rápidas ===== */
.clone-quick[b-0xd3jrxmoj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.clone-quick-btn[b-0xd3jrxmoj] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
    font-weight: 700;
    font-size: 0.76rem;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.clone-quick-btn .material-icons-round[b-0xd3jrxmoj] { font-size: 0.95rem; }

.clone-quick-btn:hover:not(:disabled)[b-0xd3jrxmoj] {
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    border-color: var(--rs-primary-light, #8b3d7c);
}

.clone-quick-btn:disabled[b-0xd3jrxmoj] { opacity: 0.5; cursor: default; }

/* ===== Días ===== */
.clone-days[b-0xd3jrxmoj] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

@media (min-width: 460px) {
    .clone-days[b-0xd3jrxmoj] { grid-template-columns: repeat(3, 1fr); }
}

.clone-day[b-0xd3jrxmoj] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.7rem;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    color: #374151;
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, transform 0.12s, box-shadow 0.15s;
    text-align: left;
}

.clone-day:hover[b-0xd3jrxmoj] {
    border-color: #cbd5e1;
    transform: translateY(-1px);
}

.clone-day-check[b-0xd3jrxmoj] {
    display: inline-flex;
    color: #cbd5e1;
    flex: 0 0 auto;
}

.clone-day-check .material-icons-round[b-0xd3jrxmoj] { font-size: 1.2rem; }

.clone-day-label[b-0xd3jrxmoj] {
    flex: 1;
    min-width: 0;
}

.clone-day.sel[b-0xd3jrxmoj] {
    border-color: var(--c, var(--rs-primary, #631656));
    background: color-mix(in srgb, var(--c, #631656) 8%, #fff);
    box-shadow: 0 2px 8px color-mix(in srgb, var(--c, #631656) 22%, transparent);
}

.clone-day.sel .clone-day-check[b-0xd3jrxmoj] { color: var(--c, var(--rs-primary, #631656)); }

/* aviso sobrescritura */
.clone-day-warn[b-0xd3jrxmoj] {
    display: inline-flex;
    color: #d97706;
    flex: 0 0 auto;
}

.clone-day-warn .material-icons-round[b-0xd3jrxmoj] { font-size: 1rem; }

.clone-day.has-rot[b-0xd3jrxmoj] { border-style: dashed; }
.clone-day.has-rot.sel[b-0xd3jrxmoj] { border-style: solid; }

/* ===== Banner de aviso ===== */
.clone-warn-banner[b-0xd3jrxmoj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 10px;
    padding: 0.55rem 0.75rem;
}

.clone-warn-banner .material-icons-round[b-0xd3jrxmoj] { font-size: 1.05rem; color: #d97706; }

/* ===== Footer ===== */
.clone-footer[b-0xd3jrxmoj] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.25rem;
}
/* /Pages/Lanzaderas/LanzaderaCreateDialog.razor.rz.scp.css */
.create-dialog[b-yr4iike2j1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ===== Preview en vivo ===== */
.create-preview[b-yr4iike2j1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.1rem 1rem 1rem;
    border-radius: 14px;
    background: linear-gradient(180deg, #04070f 0%, #0b1626 55%, #1b3350 100%);
    border: 1px solid #1e293b;
    position: relative;
    overflow: hidden;
    transition: opacity 0.2s;
}

.create-preview.preview-empty[b-yr4iike2j1] { opacity: 0.85; }

/* vía bajo el tren */
.preview-train[b-yr4iike2j1] {
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
    padding-bottom: 8px;
}

.preview-train[b-yr4iike2j1]::after {
    content: '';
    position: absolute;
    left: -30px;
    right: -30px;
    bottom: 0;
    height: 3px;
    background: #3d5273;
    border-radius: 2px;
}

.preview-loco[b-yr4iike2j1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 28px;
    border-radius: 7px 4px 4px 4px;
    background: linear-gradient(160deg, #8b3d7c, #631656);
    color: #fff;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
}

.preview-loco .material-icons-round[b-yr4iike2j1] { font-size: 1.1rem; }

.preview-wagon[b-yr4iike2j1] {
    width: 30px;
    height: 22px;
    border-radius: 4px;
    background: linear-gradient(180deg, #2a6fd4, #16407e);
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
}

.preview-name[b-yr4iike2j1] {
    font-size: 1.05rem;
    font-weight: 800;
    color: #fff;
    text-align: center;
}

.preview-route[b-yr4iike2j1] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    justify-content: center;
}

.preview-route-placeholder[b-yr4iike2j1] {
    font-size: 0.78rem;
    color: #64748b;
    font-style: italic;
}

.route-dot[b-yr4iike2j1] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.route-origin[b-yr4iike2j1] { background: #4ade80; box-shadow: 0 0 8px rgba(74, 222, 128, 0.7); }
.route-end[b-yr4iike2j1] { background: #60a5fa; box-shadow: 0 0 8px rgba(96, 165, 250, 0.7); }

.preview-route-name[b-yr4iike2j1] {
    font-size: 0.84rem;
    font-weight: 700;
    color: #e2e8f0;
}

.preview-route-line[b-yr4iike2j1] {
    width: 26px;
    height: 2px;
    background: repeating-linear-gradient(90deg,
        rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0.5) 4px,
        transparent 4px, transparent 8px);
}

.preview-km[b-yr4iike2j1] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #93c5fd;
    background: rgba(96, 165, 250, 0.12);
    border: 1px solid rgba(96, 165, 250, 0.3);
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
}

.preview-company[b-yr4iike2j1] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.74rem;
    color: #94a3b8;
}

.preview-company .material-icons-round[b-yr4iike2j1] { font-size: 0.9rem; }

/* ===== Form ===== */
.create-hint[b-yr4iike2j1] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.78rem;
    color: #6b7280;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.55rem 0.75rem;
}

.create-hint .material-icons-round[b-yr4iike2j1] {
    font-size: 1rem;
    color: var(--rs-primary, #631656);
}
/* /Pages/Lanzaderas/LanzaderaEditor.razor.rz.scp.css */
.lanzadera-editor-card[b-tjxigtcivg] {
    max-width: 1600px;
}

.editor-loading[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 3rem;
    color: #6b7280;
}

/* ===== Hero ===== */
.editor-hero[b-tjxigtcivg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: 14px;
    background: linear-gradient(120deg, #2b0d26 0%, #631656 55%, #8b3d7c 100%);
    color: #fff;
    box-shadow: 0 8px 24px rgba(99, 22, 86, 0.3);
}

.hero-left[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

.hero-back[b-tjxigtcivg] {
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s;
}

.hero-back:hover[b-tjxigtcivg] { background: rgba(255, 255, 255, 0.22); }
.hero-back .material-icons-round[b-tjxigtcivg] { font-size: 1.2rem; }

.hero-titles[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.hero-name[b-tjxigtcivg] {
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.15;
}

.hero-route[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.92);
    flex-wrap: wrap;
}

.route-dot[b-tjxigtcivg] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.route-origin[b-tjxigtcivg] { background: #4ade80; box-shadow: 0 0 8px rgba(74, 222, 128, 0.8); }
.route-end[b-tjxigtcivg] { background: #60a5fa; box-shadow: 0 0 8px rgba(96, 165, 250, 0.8); }

.route-line[b-tjxigtcivg] {
    width: 36px;
    height: 2px;
    background: repeating-linear-gradient(90deg,
        rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.7) 5px,
        transparent 5px, transparent 9px);
    flex: 0 0 auto;
}

.hero-meta[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.76rem;
    color: rgba(255, 255, 255, 0.75);
    flex-wrap: wrap;
}

.hero-meta .material-icons-round[b-tjxigtcivg] { font-size: 0.95rem; }
.hero-meta-sep[b-tjxigtcivg] { margin: 0 0.2rem; }

.hero-right[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.unsaved-badge[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.76rem;
    font-weight: 700;
    color: #fde68a;
    background: rgba(217, 119, 6, 0.25);
    border: 1px solid rgba(253, 230, 138, 0.4);
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    animation: pulse-badge-b-tjxigtcivg 2s ease-in-out infinite;
}

.unsaved-badge .material-icons-round[b-tjxigtcivg] { font-size: 0.9rem; }

@keyframes pulse-badge-b-tjxigtcivg {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.65; }
}

/* estado segmentado */
.estado-toggle[b-tjxigtcivg] {
    display: inline-flex;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    padding: 3px;
    gap: 3px;
}

.estado-btn[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    border: none;
    background: transparent;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 700;
    font-size: 0.78rem;
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.estado-btn .material-icons-round[b-tjxigtcivg] { font-size: 1rem; }
.estado-btn:hover:not(:disabled)[b-tjxigtcivg] { color: #fff; }
.estado-btn:disabled[b-tjxigtcivg] { cursor: default; opacity: 0.6; }

.estado-btn.active.draft[b-tjxigtcivg] {
    background: rgba(255, 255, 255, 0.92);
    color: #631656;
}

.estado-btn.active.confirmed[b-tjxigtcivg] {
    background: #16a34a;
    color: #fff;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.45);
}

/* ===== Layout ===== */
.editor-layout[b-tjxigtcivg] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 1rem;
    align-items: start;
}

@media (max-width: 960px) {
    .editor-layout[b-tjxigtcivg] {
        grid-template-columns: 1fr;
    }
}

/* ===== Pool ===== */
.pool-panel[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    max-height: 640px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fbfcfe;
    padding: 0.9rem;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.pool-header[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pool-title[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.92rem;
    color: #1f2937;
}

.pool-title .material-icons-round[b-tjxigtcivg] {
    font-size: 1.15rem;
    color: var(--rs-primary, #631656);
}

.pool-count[b-tjxigtcivg] {
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    font-weight: 800;
    font-size: 0.78rem;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
}

.pool-actions[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.pool-list-meta[b-tjxigtcivg] {
    font-size: 0.75rem;
    color: var(--rs-primary, #631656);
    font-weight: 600;
}

.pool-checkbox-list[b-tjxigtcivg] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-right: 2px;
}

.pool-checkbox-list[b-tjxigtcivg]::-webkit-scrollbar { width: 7px; }
.pool-checkbox-list[b-tjxigtcivg]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.pool-checkbox-item[b-tjxigtcivg] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.5rem 0.65rem;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s, transform 0.12s;
}

.pool-checkbox-item:hover[b-tjxigtcivg] {
    background: var(--rs-primary-subtle, #f5eaf3);
    border-color: var(--rs-primary-light, #8b3d7c);
    transform: translateX(2px);
}

.pool-checkbox-item.checked[b-tjxigtcivg] {
    background: var(--rs-primary-subtle, #f5eaf3);
    border-color: var(--rs-primary, #631656);
}

.pool-checkbox-body[b-tjxigtcivg] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.pool-checkbox-title[b-tjxigtcivg] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem;
}

.pool-checkbox-title strong[b-tjxigtcivg] {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
}

.pool-tipo[b-tjxigtcivg] {
    font-size: 0.76rem;
    color: #6b7280;
}

/* ===== Grupos colapsables del pool ===== */
.pool-group[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.pool-group-header[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.55rem;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    cursor: pointer;
    user-select: none;
    transition: background 0.12s, border-color 0.12s;
}

.pool-group-header:hover[b-tjxigtcivg] {
    background: var(--rs-primary-subtle, #f5eaf3);
    border-color: var(--rs-primary-light, #8b3d7c);
}

.pool-group-chevron[b-tjxigtcivg] {
    font-size: 1.15rem;
    color: #64748b;
    transition: transform 0.15s;
    flex-shrink: 0;
}

.pool-group-header.open .pool-group-chevron[b-tjxigtcivg] {
    transform: rotate(90deg);
    color: var(--rs-primary, #631656);
}

.pool-group-check[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
}

.pool-group-name[b-tjxigtcivg] {
    flex: 1;
    min-width: 0;
    font-weight: 700;
    font-size: 0.8rem;
    color: #1f2937;
    font-family: 'IBM Plex Mono', monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pool-group-count[b-tjxigtcivg] {
    flex-shrink: 0;
    font-size: 0.72rem;
    font-weight: 800;
    color: #475569;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    min-width: 22px;
    height: 20px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pool-group-items[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding-left: 0.4rem;
}

/* ===== Drag desde el pool ===== */
.pool-drag-grip[b-tjxigtcivg] {
    font-size: 1.05rem;
    color: #94a3b8;
    cursor: grab;
    flex-shrink: 0;
    margin-top: 1px;
}

.pool-checkbox-item[draggable="true"][b-tjxigtcivg] { cursor: grab; }
.pool-checkbox-item.pool-dragging[b-tjxigtcivg] {
    opacity: 0.5;
    border-style: dashed;
    border-color: var(--rs-primary, #631656);
}

/* ===== Zona de drop (composición) ===== */
.composition-drop-zone[b-tjxigtcivg] {
    position: relative;
    flex: 1;
    min-width: 0;
    border-radius: 14px;
    transition: box-shadow 0.15s, outline 0.15s;
}

.composition-drop-zone.drop-active[b-tjxigtcivg] {
    outline: 2px dashed var(--rs-primary, #631656);
    outline-offset: 4px;
    box-shadow: 0 0 0 6px rgba(99, 22, 86, 0.08);
}

.composition-drop-zone.drop-active[b-tjxigtcivg]::after {
    content: 'Suelta para añadir el vagón al tren';
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    background: var(--rs-primary, #631656);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 999px;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(99, 22, 86, 0.35);
}

.pool-checkbox-badges[b-tjxigtcivg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.pool-empty-hint[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: #6b7280;
    padding: 1.5rem 0.5rem;
    text-align: center;
}

.pool-empty-hint .material-icons-round[b-tjxigtcivg] {
    font-size: 1.8rem;
    color: #16a34a;
    opacity: 0.6;
}

/* ===== Color dot en hero ===== */
.hero-color-dot[b-tjxigtcivg] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.7);
    vertical-align: middle;
    margin-right: 0.3rem;
}

/* ===== Selector de día (tabs) ===== */
.day-tabs[b-tjxigtcivg] {
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.day-tab[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    padding: 0.55rem 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    color: #6b7280;
    font-weight: 700;
    font-size: 0.82rem;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s, transform 0.12s;
    min-width: 58px;
}

.day-tab:hover[b-tjxigtcivg] {
    background: #f8fafc;
    border-color: #cbd5e1;
    transform: translateY(-1px);
}

.day-tab-active[b-tjxigtcivg] {
    background: #fdf9fc;
    border-width: 2px;
    box-shadow: 0 2px 8px rgba(99, 22, 86, 0.12);
}

.day-tab-label[b-tjxigtcivg] {
    line-height: 1;
}

.day-tab-dot[b-tjxigtcivg] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    transition: transform 0.15s;
}

.day-tab-active .day-tab-dot[b-tjxigtcivg] {
    transform: scale(1.3);
}

/* ===== Barra de ruta del día ===== */
.day-route-bar[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.6rem 0.8rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.rot-operational-fields[b-tjxigtcivg] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    flex-wrap: wrap;
    padding: 0.5rem 0.8rem;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-top: 0.4rem;
}

.rot-checkbox-field[b-tjxigtcivg] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding-bottom: 0.5rem;
}

.rot-checkbox-label[b-tjxigtcivg] {
    font-size: 0.82rem;
    color: #475569;
    white-space: nowrap;
}

.day-route-readonly[b-tjxigtcivg] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: #374151;
}

.day-route-empty[b-tjxigtcivg] {
    font-size: 0.85rem;
    color: #94a3b8;
    font-style: italic;
}

/* ===== Estado vacío sin rotación ===== */
.no-rotacion-hint[b-tjxigtcivg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
    text-align: center;
    color: #6b7280;
    font-size: 0.9rem;
}

.no-rotacion-hint .material-icons-round[b-tjxigtcivg] {
    font-size: 3rem;
    color: #cbd5e1;
}

.no-rotacion-hint strong[b-tjxigtcivg] {
    color: #374151;
}
/* /Pages/Lanzaderas/LanzaderaOperationalPanel.razor.rz.scp.css */
.op-panel[b-vvlwzs2bhl] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}

.op-header[b-vvlwzs2bhl] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 1rem;
    border: none;
    background: linear-gradient(120deg, #fbfcfe, #f5eaf3);
    cursor: pointer;
}

.op-header-left[b-vvlwzs2bhl] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.op-header-left .material-icons-round[b-vvlwzs2bhl] { color: var(--rs-primary, #631656); }

.op-title[b-vvlwzs2bhl] {
    font-weight: 700;
    font-size: 0.92rem;
    color: #1f2937;
}

.op-badges[b-vvlwzs2bhl] { display: inline-flex; gap: 0.4rem; }

.op-badge[b-vvlwzs2bhl] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.76rem;
    font-weight: 700;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
}

.op-badge .material-icons-round[b-vvlwzs2bhl] { font-size: 0.85rem; }

.op-badge-danger[b-vvlwzs2bhl] { background: #fef2f2; color: #dc2626; }
.op-badge-warn[b-vvlwzs2bhl] { background: #fffbeb; color: #d97706; }
.op-badge-ok[b-vvlwzs2bhl] { background: #f1f5f9; color: #64748b; }

.op-body[b-vvlwzs2bhl] { padding: 0.9rem 1rem; border-top: 1px solid #eef2f7; }

.op-loading[b-vvlwzs2bhl],
.op-empty[b-vvlwzs2bhl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6b7280;
    font-size: 0.86rem;
    padding: 0.6rem 0;
}

.op-empty .material-icons-round[b-vvlwzs2bhl] { color: var(--rs-primary, #631656); }

.op-grid[b-vvlwzs2bhl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 760px) {
    .op-grid[b-vvlwzs2bhl] { grid-template-columns: 1fr; }
}

.op-col[b-vvlwzs2bhl] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.op-col-head[b-vvlwzs2bhl] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 700;
    font-size: 0.82rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid #f1f5f9;
}

.op-col-head .material-icons-round[b-vvlwzs2bhl] { font-size: 1rem; }
.op-col-issue[b-vvlwzs2bhl] { color: #dc2626; }
.op-col-stop[b-vvlwzs2bhl] { color: #d97706; }

.op-col-empty[b-vvlwzs2bhl] {
    font-size: 0.8rem;
    color: #94a3b8;
    font-style: italic;
    padding: 0.5rem 0;
}

.op-row[b-vvlwzs2bhl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.5rem;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background 0.12s;
}

.op-row:hover[b-vvlwzs2bhl] { background: #f8fafc; }

.op-row-pos[b-vvlwzs2bhl] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rs-primary, #631656);
    font-family: 'IBM Plex Mono', monospace;
    flex: 0 0 auto;
}

.op-row-plate[b-vvlwzs2bhl] {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 700;
    font-size: 0.82rem;
    color: #111827;
    flex: 0 0 auto;
}

.op-row-main[b-vvlwzs2bhl] {
    flex: 1;
    min-width: 0;
    font-size: 0.8rem;
    color: #4b5563;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.op-row-date[b-vvlwzs2bhl] {
    font-size: 0.74rem;
    color: #94a3b8;
    flex: 0 0 auto;
}
/* /Pages/Lanzaderas/LanzaderasIndex.razor.rz.scp.css */
.lanzaderas-index-card[b-zb6hytvxt3] {
    max-width: 1600px;
}

.index-topbar[b-zb6hytvxt3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* ===== Skeletons ===== */
.skeleton[b-zb6hytvxt3] {
    display: block;
    border-radius: 8px;
    background: linear-gradient(90deg, #eef1f6 25%, #f8fafc 50%, #eef1f6 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-zb6hytvxt3 1.4s ease-in-out infinite;
}

@keyframes skeleton-shimmer-b-zb6hytvxt3 {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

.skeleton-card[b-zb6hytvxt3] { cursor: default !important; pointer-events: none; }
.skeleton-icon[b-zb6hytvxt3] { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; }
.skeleton-line[b-zb6hytvxt3] { height: 16px; margin: 3px 0; }
.skeleton-thin[b-zb6hytvxt3] { height: 11px; }
.skeleton-block[b-zb6hytvxt3] { height: 44px; border-radius: 10px; }

/* ===== Navegador de semana ===== */
.week-nav[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.week-arrow[b-zb6hytvxt3] {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.week-arrow:hover[b-zb6hytvxt3] {
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    border-color: var(--rs-primary-light, #8b3d7c);
}

.week-pill[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(120deg, #631656, #8b3d7c);
    color: #fff;
    padding: 0.5rem 1.1rem;
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(99, 22, 86, 0.25);
}

.week-pill .material-icons-round[b-zb6hytvxt3] { font-size: 1.05rem; opacity: 0.85; }

.week-label[b-zb6hytvxt3] {
    font-weight: 700;
    font-size: 0.92rem;
    min-width: 180px;
    text-align: center;
}

.week-today[b-zb6hytvxt3] {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
    font-weight: 700;
    font-size: 0.82rem;
    height: 38px;
    padding: 0 0.9rem;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.week-today:hover[b-zb6hytvxt3] {
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    border-color: var(--rs-primary-light, #8b3d7c);
}

/* ===== KPIs ===== */
.kpi-row[b-zb6hytvxt3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.75rem;
}

.kpi-card[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
    position: relative;
    overflow: hidden;
}

/* Acento de color como barra lateral, no como fondo (coherente con el resto de la app) */
.kpi-card[b-zb6hytvxt3]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--rs-primary, #631656);
}

.kpi-icon[b-zb6hytvxt3] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--rs-primary, #631656);
    color: #fff;
    flex: 0 0 auto;
}

.kpi-icon .material-icons-round[b-zb6hytvxt3] { font-size: 1.3rem; }

.kpi-body[b-zb6hytvxt3] { display: flex; flex-direction: column; line-height: 1.15; }

.kpi-value[b-zb6hytvxt3] {
    font-size: 1.45rem;
    font-weight: 800;
    color: #111827;
    font-family: 'IBM Plex Mono', monospace;
}

.kpi-label[b-zb6hytvxt3] {
    font-size: 0.72rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.kpi-card.kpi-blue[b-zb6hytvxt3]::before { background: #1d4ed8; }
.kpi-card.kpi-blue .kpi-icon[b-zb6hytvxt3] { background: #1d4ed8; }

.kpi-card.kpi-green[b-zb6hytvxt3]::before { background: #16a34a; }
.kpi-card.kpi-green .kpi-icon[b-zb6hytvxt3] { background: #16a34a; }

.kpi-card.kpi-amber[b-zb6hytvxt3]::before { background: #d97706; }
.kpi-card.kpi-amber .kpi-icon[b-zb6hytvxt3] { background: #d97706; }

/* ===== Grid de lanzaderas ===== */
.lanzadera-grid[b-zb6hytvxt3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1rem;
}

@media (max-width: 480px) {
    .lanzadera-grid[b-zb6hytvxt3] { grid-template-columns: 1fr; }
}

.lanzadera-card[b-zb6hytvxt3] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    border-top: 4px solid #cbd5e1;
    background: #fff;
    cursor: pointer;
    transition: transform 0.18s, box-shadow 0.18s, border-color 0.18s;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
    animation: card-in-b-zb6hytvxt3 0.38s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

@keyframes card-in-b-zb6hytvxt3 {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
}

.lanzadera-card:hover[b-zb6hytvxt3] {
    transform: translateY(-3px);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.12);
    border-color: var(--rs-primary-light, #8b3d7c);
}

.lanzadera-card.card-confirmed[b-zb6hytvxt3] { border-top-color: #16a34a; }
.lanzadera-card.card-draft[b-zb6hytvxt3] { border-top-color: #2563eb; }
.lanzadera-card.card-none[b-zb6hytvxt3] { border-top-color: #cbd5e1; }

.card-top[b-zb6hytvxt3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.6rem;
}

.card-name-block[b-zb6hytvxt3] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.card-name[b-zb6hytvxt3] {
    font-weight: 800;
    font-size: 1.02rem;
    color: #111827;
    line-height: 1.2;
}

.card-company[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.74rem;
    color: #6b7280;
}

.card-company .material-icons-round[b-zb6hytvxt3] { font-size: 0.9rem; }

.estado-chip[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    white-space: nowrap;
    flex: 0 0 auto;
}

.estado-chip .material-icons-round[b-zb6hytvxt3] { font-size: 0.85rem; }

.estado-confirmed[b-zb6hytvxt3] { background: #dcfce7; color: #15803d; }
.estado-draft[b-zb6hytvxt3] { background: #dbeafe; color: #1d4ed8; }
.estado-none[b-zb6hytvxt3] { background: #f1f5f9; color: #64748b; }
.estado-inherited[b-zb6hytvxt3] { background: #f3e8ff; color: #7e22ce; }

/* ===== Ruta ===== */
.card-route[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.route-point[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.route-dot[b-zb6hytvxt3] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.route-origin[b-zb6hytvxt3] { background: #16a34a; box-shadow: 0 0 0 3px #dcfce7; }
.route-end[b-zb6hytvxt3] { background: #2563eb; box-shadow: 0 0 0 3px #dbeafe; }

.route-name[b-zb6hytvxt3] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.route-track-line[b-zb6hytvxt3] {
    flex: 1;
    height: 3px;
    min-width: 24px;
    background: repeating-linear-gradient(90deg,
        #cbd5e1 0, #cbd5e1 6px,
        transparent 6px, transparent 11px);
    border-radius: 2px;
}

/* ===== Mini tren ===== */
.mini-train[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 0.55rem 0.7rem;
    border-radius: 10px;
    background: linear-gradient(180deg, #0b1626, #16283f);
    border: 1px solid #1e293b;
    overflow: hidden;
    position: relative;
}

/* vía */
.mini-train[b-zb6hytvxt3]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 7px;
    height: 2px;
    background: #3d5273;
}

.mini-loco[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 20px;
    border-radius: 5px 3px 3px 3px;
    background: linear-gradient(160deg, #8b3d7c, #631656);
    color: #fff;
    z-index: 1;
    flex: 0 0 auto;
}

.mini-loco .material-icons-round[b-zb6hytvxt3] { font-size: 0.85rem; }

.mini-wagon[b-zb6hytvxt3] {
    width: 18px;
    height: 14px;
    border-radius: 3px;
    background: linear-gradient(180deg, #2a6fd4, #16407e);
    border: 1px solid rgba(255, 255, 255, 0.18);
    z-index: 1;
    flex: 0 0 auto;
}

.mini-more[b-zb6hytvxt3] {
    font-size: 0.68rem;
    font-weight: 700;
    color: #94a3b8;
    z-index: 1;
    padding-left: 2px;
    font-family: 'IBM Plex Mono', monospace;
}

.mini-empty[b-zb6hytvxt3] {
    font-size: 0.74rem;
    color: #64748b;
    z-index: 1;
    font-style: italic;
}

.mini-count[b-zb6hytvxt3] {
    margin-left: auto;
    z-index: 1;
    background: rgba(96, 165, 250, 0.15);
    border: 1px solid rgba(96, 165, 250, 0.35);
    color: #93c5fd;
    font-weight: 800;
    font-size: 0.72rem;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
    flex: 0 0 auto;
}

/* ===== Footer tarjeta ===== */
.card-footer[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-top: 0.6rem;
    border-top: 1px solid #f1f5f9;
    cursor: default;
}

/* ===== Vacío ===== */
.index-empty[b-zb6hytvxt3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 3.5rem 1.5rem;
    text-align: center;
}

.index-empty > .material-icons-round[b-zb6hytvxt3] {
    font-size: 3.4rem;
    color: var(--rs-primary-light, #8b3d7c);
    opacity: 0.35;
}

.empty-title[b-zb6hytvxt3] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #374151;
}

.empty-sub[b-zb6hytvxt3] {
    font-size: 0.88rem;
    color: #6b7280;
    max-width: 420px;
    margin-bottom: 0.5rem;
}

/* ===== Color dot en tarjetas ===== */
.card-color-dot[b-zb6hytvxt3] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: inline-block;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

/* ===== Resumen de rotaciones en tarjeta ===== */
.card-rotaciones-summary[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    color: #6b7280;
    font-weight: 600;
}

.card-rotaciones-summary .material-icons-round[b-zb6hytvxt3] {
    font-size: 1rem;
    color: var(--card-color, #631656);
}

/* ===== Topbar actions ===== */
.index-topbar-actions[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ===== Gantt semanal ===== */
.gantt-container[b-zb6hytvxt3] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    animation: card-in-b-zb6hytvxt3 0.38s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.gantt-header[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    padding: 0.7rem 1rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.gantt-title[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--rs-primary, #631656);
}

.gantt-title .material-icons-round[b-zb6hytvxt3] {
    font-size: 1.1rem;
}

.gantt-table[b-zb6hytvxt3] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.gantt-table thead th[b-zb6hytvxt3] {
    padding: 0.55rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    text-align: center;
}

.gantt-name-col[b-zb6hytvxt3] {
    text-align: left !important;
    min-width: 160px;
    padding-left: 1rem !important;
}

.gantt-table tbody tr[b-zb6hytvxt3] {
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.12s;
}

.gantt-table tbody tr:hover[b-zb6hytvxt3] {
    background: #faf8fb;
}

.gantt-name-cell[b-zb6hytvxt3] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 0.5rem 0.6rem 1rem;
    font-weight: 700;
    color: #1f2937;
    white-space: nowrap;
}

.gantt-color-dot[b-zb6hytvxt3] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.gantt-cell[b-zb6hytvxt3] {
    padding: 0.5rem 0.4rem;
    text-align: center;
    vertical-align: middle;
    color: #94a3b8;
    min-width: 90px;
}

.gantt-cell.gantt-active[b-zb6hytvxt3] {
    color: #1f2937;
    border-radius: 0;
}

.gantt-cell-empty[b-zb6hytvxt3] {
    color: #cbd5e1;
    font-weight: 700;
}

.gantt-cell-route[b-zb6hytvxt3] {
    display: block;
    font-size: 0.74rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 130px;
    margin: 0 auto 3px;
}

.gantt-cell-count[b-zb6hytvxt3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.66rem;
    font-weight: 800;
    color: #fff;
    background: #64748b;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
}

/* ===== Accesibilidad: movimiento reducido ===== */
@media (prefers-reduced-motion: reduce) {
    .lanzadera-card[b-zb6hytvxt3],
    .skeleton[b-zb6hytvxt3] {
        animation: none !important;
    }

    .lanzadera-card[b-zb6hytvxt3],
    .week-arrow[b-zb6hytvxt3],
    .week-today[b-zb6hytvxt3] {
        transition: none !important;
    }
}
/* /Pages/Lanzaderas/PasteWagonsDialog.razor.rz.scp.css */
.paste-dialog[b-ddyphpppr1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.paste-grid[b-ddyphpppr1] {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 1rem;
}

@media (max-width: 620px) {
    .paste-grid[b-ddyphpppr1] { grid-template-columns: 1fr; }
}

/* ===== Entrada ===== */
.paste-input-col[b-ddyphpppr1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.paste-label[b-ddyphpppr1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: #374151;
}

.paste-label .material-icons-round[b-ddyphpppr1] { font-size: 1.05rem; color: var(--rs-primary, #631656); }

.paste-textarea[b-ddyphpppr1] {
    width: 100%;
    min-height: 230px;
    resize: vertical;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 0.85rem;
    line-height: 1.5;
    color: #1f2937;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.paste-textarea:focus[b-ddyphpppr1] {
    border-color: var(--rs-primary, #631656);
    box-shadow: 0 0 0 3px var(--rs-primary-lighter, rgba(99, 22, 86, 0.12));
}

.paste-input-hint[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.76rem;
    color: #6b7280;
}

.paste-input-hint .material-icons-round[b-ddyphpppr1] { font-size: 0.95rem; color: #d97706; }

/* ===== Subida de fichero ===== */
.paste-upload-row[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.paste-upload-btn[b-ddyphpppr1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--rs-primary, #631656);
    background: var(--rs-primary-subtle, #f5eaf3);
    border: 1px solid #ece0ea;
    border-radius: 999px;
    padding: 0.4rem 0.8rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    position: relative;
    overflow: hidden;
}

.paste-upload-btn:hover[b-ddyphpppr1] {
    background: #fff;
    border-color: var(--rs-primary-light, #8b3d7c);
}

.paste-upload-btn .material-icons-round[b-ddyphpppr1] { font-size: 1.05rem; }

/* el input nativo ocupa el botón pero invisible */
.paste-upload-input[b-ddyphpppr1] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    font-size: 0;
}

.paste-file-name[b-ddyphpppr1] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.76rem;
    color: #475569;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.paste-file-name .material-icons-round[b-ddyphpppr1] { font-size: 0.95rem; color: #16a34a; }

.paste-file-error[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: #b91c1c;
}

.paste-file-error .material-icons-round[b-ddyphpppr1] { font-size: 0.95rem; }

/* ===== Pre-borrador ===== */
.paste-preview-col[b-ddyphpppr1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.paste-preview-head[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.paste-preview-title[b-ddyphpppr1] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
}

.paste-analyzing[b-ddyphpppr1] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.76rem;
    color: var(--rs-primary, #631656);
    font-weight: 600;
}

.paste-analyzing .material-icons-round[b-ddyphpppr1] { font-size: 1rem; }

.spin[b-ddyphpppr1] { animation: paste-spin-b-ddyphpppr1 1s linear infinite; }
@keyframes paste-spin-b-ddyphpppr1 { to { transform: rotate(360deg); } }

.paste-empty[b-ddyphpppr1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    text-align: center;
    color: #94a3b8;
    font-size: 0.85rem;
    border: 1px dashed #e2e8f0;
    border-radius: 12px;
}

.paste-empty .material-icons-round[b-ddyphpppr1] { font-size: 2rem; opacity: 0.5; }

/* ===== Resumen ===== */
.paste-summary[b-ddyphpppr1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.psum[b-ddyphpppr1] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.25rem;
    font-weight: 800;
    font-size: 0.85rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
}

.psum span[b-ddyphpppr1] { font-family: inherit; font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; }

.psum-ok[b-ddyphpppr1] { background: #dcfce7; color: #15803d; }
.psum-mut[b-ddyphpppr1] { background: #f1f5f9; color: #64748b; }
.psum-warn[b-ddyphpppr1] { background: #fef3c7; color: #b45309; }
.psum-bad[b-ddyphpppr1] { background: #fee2e2; color: #b91c1c; }

/* ===== Lista pre-borrador ===== */
.paste-list[b-ddyphpppr1] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    max-height: 320px;
    overflow-y: auto;
    padding-right: 2px;
}

.paste-list[b-ddyphpppr1]::-webkit-scrollbar { width: 7px; }
.paste-list[b-ddyphpppr1]::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

.paste-row[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
    border: 1px solid #e5e7eb;
    border-left: 3px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    font-size: 0.82rem;
}

.paste-row.row-ok[b-ddyphpppr1] { border-left-color: #16a34a; }
.paste-row.row-mut[b-ddyphpppr1] { border-left-color: #cbd5e1; opacity: 0.7; }
.paste-row.row-warn[b-ddyphpppr1] { border-left-color: #d97706; background: #fffdf5; }
.paste-row.row-bad[b-ddyphpppr1] { border-left-color: #dc2626; background: #fef7f7; }

.paste-pos[b-ddyphpppr1] {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: #f1f5f9;
    color: #475569;
    font-weight: 800;
    font-size: 0.72rem;
    font-family: 'IBM Plex Mono', monospace;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.row-ok .paste-pos[b-ddyphpppr1] { background: var(--rs-primary, #631656); color: #fff; }

.paste-raw[b-ddyphpppr1] {
    flex: 0 0 auto;
    font-family: 'IBM Plex Mono', monospace;
    color: #6b7280;
    min-width: 56px;
}

.paste-arrow[b-ddyphpppr1] { color: #cbd5e1; font-size: 1rem; flex: 0 0 auto; }

.paste-result[b-ddyphpppr1] {
    flex: 1;
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    overflow: hidden;
}

.paste-plate[b-ddyphpppr1] {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 700;
    color: #111827;
    white-space: nowrap;
}

.paste-tipo[b-ddyphpppr1] { font-size: 0.72rem; color: #6b7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.paste-msg[b-ddyphpppr1] { font-size: 0.78rem; }
.paste-msg.bad[b-ddyphpppr1] { color: #b91c1c; }
.paste-msg.warn[b-ddyphpppr1] { color: #b45309; }

.paste-badges[b-ddyphpppr1] {
    flex: 0 0 auto;
    display: inline-flex;
    gap: 0.25rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.pb[b-ddyphpppr1] {
    font-size: 0.62rem;
    font-weight: 700;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    white-space: nowrap;
}

.pb-mut[b-ddyphpppr1] { background: #f1f5f9; color: #64748b; }
.pb-warn[b-ddyphpppr1] { background: #fef3c7; color: #b45309; }
.pb-bad[b-ddyphpppr1] { background: #fee2e2; color: #b91c1c; }

/* ===== Footer ===== */
.paste-footer[b-ddyphpppr1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    border-top: 1px solid #f1f5f9;
    padding-top: 0.8rem;
}

.paste-replace[b-ddyphpppr1] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.82rem;
    color: #475569;
    cursor: pointer;
}

.paste-footer-actions[b-ddyphpppr1] {
    display: inline-flex;
    gap: 0.5rem;
}
/* /Pages/Lanzaderas/TrainCompositionTwin.razor.rz.scp.css */
/* ===== Shell ===== */
.twin-shell[b-dpnfv4vk7x] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    min-width: 0;
}

/* ===== Toolbar ===== */
.twin-toolbar[b-dpnfv4vk7x] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.twin-title-block[b-dpnfv4vk7x] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.twin-title[b-dpnfv4vk7x] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.95rem;
    color: #1f2937;
}

.twin-title .material-icons-round[b-dpnfv4vk7x] {
    font-size: 1.2rem;
    color: var(--rs-primary, #631656);
}

.twin-route[b-dpnfv4vk7x] {
    font-size: 0.8rem;
    color: #6b7280;
    padding-left: 1.65rem;
}

.twin-stats[b-dpnfv4vk7x] {
    display: flex;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.twin-stat[b-dpnfv4vk7x] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.3rem;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.twin-stat-value[b-dpnfv4vk7x] {
    font-weight: 800;
    font-size: 0.95rem;
    color: #111827;
    font-family: 'IBM Plex Mono', monospace;
}

.twin-stat-label[b-dpnfv4vk7x] {
    font-size: 0.7rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.twin-stat.stat-danger[b-dpnfv4vk7x] { background: #fef2f2; border-color: #fecaca; }
.twin-stat.stat-danger .twin-stat-value[b-dpnfv4vk7x] { color: #dc2626; }
.twin-stat.stat-warn[b-dpnfv4vk7x] { background: #fffbeb; border-color: #fde68a; }
.twin-stat.stat-warn .twin-stat-value[b-dpnfv4vk7x] { color: #d97706; }
.twin-stat.stat-muted .twin-stat-value[b-dpnfv4vk7x] { color: #6b7280; }

/* ===== Toggle 2D/3D ===== */
.twin-view-toggle[b-dpnfv4vk7x] {
    display: inline-flex;
    align-items: center;
    align-self: center;
    flex: 0 0 auto;
    background: #eef2f7;
    border: 1px solid #dbe3ec;
    border-radius: 10px;
    padding: 3px;
    gap: 3px;
}

.view-btn[b-dpnfv4vk7x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    border: none;
    background: transparent;
    color: #64748b;
    font-weight: 700;
    font-size: 0.8rem;
    line-height: 1;
    white-space: nowrap;
    padding: 0.35rem 0.8rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}

.view-btn .material-icons-round[b-dpnfv4vk7x] { font-size: 1rem; line-height: 1; }

.view-btn:hover[b-dpnfv4vk7x] { color: var(--rs-primary, #631656); }

.view-btn.active[b-dpnfv4vk7x] {
    background: var(--rs-primary, #631656);
    color: #fff;
    /* sombra contenida para que el pill no se desborde del track gris */
    box-shadow: 0 1px 2px rgba(99, 22, 86, 0.3);
}

/* ===== Vista 3D ===== */
.twin-3d-wrap[b-dpnfv4vk7x] {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #1e293b;
    background: #060b16;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(2, 8, 20, 0.25);
}

.twin-3d-host[b-dpnfv4vk7x] {
    width: 100%;
    height: 540px;
}

.twin-3d-host[b-dpnfv4vk7x]  canvas,
.twin-3d-host canvas[b-dpnfv4vk7x] {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.twin-3d-hud[b-dpnfv4vk7x] {
    position: absolute;
    left: 12px;
    bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    pointer-events: none;
}

.twin-3d-hud span[b-dpnfv4vk7x] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: #9fb3cc;
    background: rgba(8, 14, 26, 0.72);
    border: 1px solid rgba(96, 165, 250, 0.18);
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    backdrop-filter: blur(4px);
    width: fit-content;
}

.twin-3d-hud .material-icons-round[b-dpnfv4vk7x] { font-size: 0.9rem; color: #60a5fa; }

.twin-3d-empty[b-dpnfv4vk7x] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #64748b;
    font-size: 0.95rem;
    pointer-events: none;
}

.twin-3d-empty .material-icons-round[b-dpnfv4vk7x] { font-size: 3rem; opacity: 0.4; }

.twin-3d-controls[b-dpnfv4vk7x] {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.twin-3d-ctrl[b-dpnfv4vk7x] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(96, 165, 250, 0.25);
    background: rgba(8, 14, 26, 0.72);
    color: #9fb3cc;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    backdrop-filter: blur(4px);
    transition: color 0.15s, border-color 0.15s, transform 0.15s;
}

.twin-3d-ctrl:hover[b-dpnfv4vk7x] {
    color: #fff;
    border-color: rgba(96, 165, 250, 0.6);
    transform: scale(1.06);
}

.twin-3d-ctrl .material-icons-round[b-dpnfv4vk7x] { font-size: 1.15rem; }

/* ===== Modo presentación (pantalla completa) ===== */
.twin-3d-wrap:fullscreen[b-dpnfv4vk7x] {
    border: none;
    border-radius: 0;
}

.twin-3d-wrap:fullscreen .twin-3d-host[b-dpnfv4vk7x] {
    height: 100vh;
}

.twin-3d-wrap:fullscreen .twin-3d-hud span[b-dpnfv4vk7x] {
    font-size: 0.8rem;
}

/* ===== Vista 2D — escena ===== */
.train-scroll-viewport[b-dpnfv4vk7x] {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border-radius: 14px;
    border: 1px solid #1e293b;
    background: #060b16;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.45), 0 8px 24px rgba(2, 8, 20, 0.25);
}

.train-scroll-viewport[b-dpnfv4vk7x]::-webkit-scrollbar { height: 9px; }
.train-scroll-viewport[b-dpnfv4vk7x]::-webkit-scrollbar-track { background: #0b1322; }
.train-scroll-viewport[b-dpnfv4vk7x]::-webkit-scrollbar-thumb {
    background: #2c3e57;
    border-radius: 5px;
}
.train-scroll-viewport[b-dpnfv4vk7x]::-webkit-scrollbar-thumb:hover { background: #3d5273; }

.train-scene[b-dpnfv4vk7x] {
    position: relative;
    min-width: 100%;
    width: max-content;
    background: linear-gradient(180deg, #04070f 0%, #0b1626 52%, #16283f 78%, #1d3350 100%);
    padding: 1.1rem 1.5rem 1.6rem;
}

.scene-sky[b-dpnfv4vk7x] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

/* estrellas */
.scene-sky[b-dpnfv4vk7x]::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(1px 1px at 12% 18%, rgba(180, 205, 235, 0.9) 50%, transparent 51%),
        radial-gradient(1px 1px at 28% 32%, rgba(180, 205, 235, 0.7) 50%, transparent 51%),
        radial-gradient(1.5px 1.5px at 45% 12%, rgba(200, 220, 245, 0.85) 50%, transparent 51%),
        radial-gradient(1px 1px at 61% 26%, rgba(180, 205, 235, 0.75) 50%, transparent 51%),
        radial-gradient(1.5px 1.5px at 74% 15%, rgba(200, 220, 245, 0.8) 50%, transparent 51%),
        radial-gradient(1px 1px at 88% 30%, rgba(180, 205, 235, 0.7) 50%, transparent 51%),
        radial-gradient(1px 1px at 35% 45%, rgba(160, 190, 225, 0.5) 50%, transparent 51%),
        radial-gradient(1px 1px at 81% 42%, rgba(160, 190, 225, 0.5) 50%, transparent 51%);
    background-size: 620px 320px;
    background-repeat: repeat-x;
}

/* siluetas de naves industriales */
.scene-skyline[b-dpnfv4vk7x] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 52px;
    height: 64px;
    background:
        linear-gradient(transparent 0, transparent 100%),
        repeating-linear-gradient(90deg,
            rgba(13, 22, 38, 0.95) 0px, rgba(13, 22, 38, 0.95) 120px,
            transparent 120px, transparent 150px,
            rgba(10, 18, 32, 0.95) 150px, rgba(10, 18, 32, 0.95) 260px,
            transparent 260px, transparent 300px);
    clip-path: polygon(0 100%, 0 38%, 6% 38%, 6% 18%, 13% 18%, 13% 42%, 22% 42%, 22% 10%, 24% 0%, 26% 10%, 26% 42%, 38% 42%, 38% 24%, 47% 24%, 47% 46%, 58% 46%, 58% 14%, 66% 14%, 66% 40%, 75% 40%, 75% 22%, 84% 22%, 84% 44%, 92% 44%, 92% 30%, 100% 30%, 100% 100%);
}

/* ventanitas iluminadas */
.scene-skyline[b-dpnfv4vk7x]::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(2px 3px at 9% 62%, rgba(96, 150, 210, 0.55) 50%, transparent 60%),
        radial-gradient(2px 3px at 23% 48%, rgba(96, 150, 210, 0.45) 50%, transparent 60%),
        radial-gradient(2px 3px at 41% 66%, rgba(96, 150, 210, 0.5) 50%, transparent 60%),
        radial-gradient(2px 3px at 60% 40%, rgba(96, 150, 210, 0.5) 50%, transparent 60%),
        radial-gradient(2px 3px at 78% 58%, rgba(96, 150, 210, 0.45) 50%, transparent 60%),
        radial-gradient(2px 3px at 94% 64%, rgba(96, 150, 210, 0.5) 50%, transparent 60%);
    background-size: 480px 100%;
    background-repeat: repeat-x;
}

/* ===== Vía ===== */
.train-track[b-dpnfv4vk7x] {
    position: relative;
    display: inline-flex;
    align-items: flex-end;
    flex-wrap: nowrap;
    gap: 0;
    min-width: min-content;
    padding: 2.4rem 1rem 0.2rem;
    z-index: 1;
}

/* carril */
.train-track[b-dpnfv4vk7x]::before {
    content: '';
    position: absolute;
    left: -1.5rem;
    right: -1.5rem;
    bottom: 16px;
    height: 4px;
    background: linear-gradient(180deg, #8b97a8, #5b6675);
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
    z-index: 0;
}

/* traviesas */
.train-track[b-dpnfv4vk7x]::after {
    content: '';
    position: absolute;
    left: -1.5rem;
    right: -1.5rem;
    bottom: 6px;
    height: 12px;
    background: repeating-linear-gradient(90deg,
        transparent 0, transparent 18px,
        #3c3328 18px, #3c3328 24px);
    z-index: -1;
    opacity: 0.85;
}

/* ===== Locomotora 2D ===== */
.loco[b-dpnfv4vk7x] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    margin-bottom: 14px;
    margin-right: 14px;
    z-index: 2;
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.5));
}

.loco-body[b-dpnfv4vk7x] {
    position: relative;
    display: flex;
    align-items: flex-end;
    height: 84px;
}

.loco-cab[b-dpnfv4vk7x] {
    width: 34px;
    height: 84px;
    background: linear-gradient(160deg, #8b3d7c, #631656);
    border-radius: 8px 4px 0 0;
    display: flex;
    justify-content: center;
    padding-top: 10px;
}

.loco-window[b-dpnfv4vk7x] {
    width: 22px;
    height: 16px;
    border-radius: 3px;
    background: linear-gradient(135deg, #bcd8f0, #5d86bd);
    box-shadow: 0 0 8px rgba(140, 190, 240, 0.5);
}

.loco-hood[b-dpnfv4vk7x] {
    width: 92px;
    height: 62px;
    background: linear-gradient(180deg, #7a2d6b 0%, #631656 60%, #4a1040 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 2px solid rgba(255, 255, 255, 0.18);
}

.loco-brand[b-dpnfv4vk7x] {
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.loco-nose[b-dpnfv4vk7x] {
    width: 18px;
    height: 50px;
    background: linear-gradient(180deg, #fbbf24, #d97706);
    clip-path: polygon(0 0, 100% 38%, 100% 100%, 0 100%);
    border-radius: 0 4px 2px 0;
}

/* ===== Vagón 2D ===== */
.train-wagon-card[b-dpnfv4vk7x] {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    margin-bottom: 14px;
    margin-right: 10px;
    z-index: 2;
    cursor: pointer;
    user-select: none;
    transition: transform 0.18s cubic-bezier(0.34, 1.4, 0.64, 1), filter 0.18s;
    filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.45));
    animation: wagon-in-b-dpnfv4vk7x 0.4s cubic-bezier(0.22, 1, 0.36, 1) backwards;
    will-change: transform;
}

@keyframes wagon-in-b-dpnfv4vk7x {
    from { opacity: 0; transform: translateX(36px); }
    to { opacity: 1; transform: none; }
}

.train-wagon-card:hover[b-dpnfv4vk7x] {
    transform: translateY(-4px);
}

.train-wagon-card.selected .wagon-body[b-dpnfv4vk7x] {
    border-color: #60a5fa;
    box-shadow: 0 0 0 2px rgba(96, 165, 250, 0.45), 0 0 22px rgba(96, 165, 250, 0.35);
}

.coupling[b-dpnfv4vk7x] {
    position: absolute;
    left: -12px;
    bottom: 28px;
    width: 14px;
    height: 5px;
    background: #1a212e;
    border-radius: 2px;
    z-index: 0;
}

.wagon-body[b-dpnfv4vk7x] {
    position: relative;
    width: 132px;
    height: 92px;
    background: linear-gradient(180deg, #2a6fd4 0%, #1e4f9c 55%, #16407e 100%);
    border: 2px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px 10px 4px 4px;
    padding: 0.4rem 0.5rem 0.3rem;
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
}

/* nervaduras de lona */
.wagon-body[b-dpnfv4vk7x]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(90deg,
        transparent 0, transparent 18px,
        rgba(255, 255, 255, 0.05) 18px, rgba(255, 255, 255, 0.05) 21px);
    pointer-events: none;
}

.train-wagon-card.state-stop .wagon-body[b-dpnfv4vk7x] {
    background: linear-gradient(180deg, #d98a16 0%, #b8730f 55%, #92560a 100%);
}

.train-wagon-card.state-inactive .wagon-body[b-dpnfv4vk7x] {
    background: linear-gradient(180deg, #555e6b 0%, #434b58 55%, #353c47 100%);
}

.wagon-pos[b-dpnfv4vk7x] {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #0b1322;
    border: 2px solid #60a5fa;
    color: #fff;
    font-size: 0.66rem;
    font-weight: 800;
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    z-index: 3;
    font-family: 'IBM Plex Mono', monospace;
}

.wagon-plate[b-dpnfv4vk7x] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #fff;
    font-family: 'IBM Plex Mono', monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 8px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    z-index: 1;
}

.wagon-tipo[b-dpnfv4vk7x] {
    font-size: 0.66rem;
    color: rgba(255, 255, 255, 0.75);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 1;
}

.wagon-leds[b-dpnfv4vk7x] {
    display: flex;
    gap: 5px;
    margin-top: auto;
    min-height: 10px;
    z-index: 1;
}

.led[b-dpnfv4vk7x] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.35);
}

.led-danger[b-dpnfv4vk7x] { background: #9ca3af; box-shadow: 0 0 6px rgba(156, 163, 175, 0.8); }
.led-warn[b-dpnfv4vk7x] { background: #fbbf24; box-shadow: 0 0 6px rgba(251, 191, 36, 0.9); }
.led-issue[b-dpnfv4vk7x] {
    background: #ef4444;
    box-shadow: 0 0 7px rgba(239, 68, 68, 1);
    animation: led-blink-b-dpnfv4vk7x 1.1s ease-in-out infinite;
}

@keyframes led-blink-b-dpnfv4vk7x {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.wagon-drag-handle[b-dpnfv4vk7x] {
    position: absolute;
    top: 3px;
    right: 3px;
    color: rgba(255, 255, 255, 0.55);
    cursor: grab;
    line-height: 1;
    padding: 2px;
    border-radius: 4px;
    z-index: 2;
}

.wagon-drag-handle:hover[b-dpnfv4vk7x] {
    color: #fff;
    background: rgba(255, 255, 255, 0.15);
}

.wagon-drag-handle .material-icons-round[b-dpnfv4vk7x] { font-size: 1rem; }

.wagon-actions[b-dpnfv4vk7x] {
    position: absolute;
    bottom: 3px;
    right: 3px;
    display: flex;
    gap: 1px;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.15s;
}

.train-wagon-card:hover .wagon-actions[b-dpnfv4vk7x] { opacity: 1; }

.wagon-btn[b-dpnfv4vk7x] {
    border: none;
    background: rgba(8, 14, 26, 0.55);
    color: rgba(255, 255, 255, 0.85);
    width: 22px;
    height: 22px;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background 0.12s;
}

.wagon-btn .material-icons-round[b-dpnfv4vk7x] { font-size: 0.95rem; }

.wagon-btn:hover:not(:disabled)[b-dpnfv4vk7x] { background: rgba(8, 14, 26, 0.85); }
.wagon-btn:disabled[b-dpnfv4vk7x] { opacity: 0.3; cursor: default; }
.wagon-btn-danger:hover:not(:disabled)[b-dpnfv4vk7x] { background: #dc2626; }

/* ruedas */
.wagon-wheels[b-dpnfv4vk7x] {
    display: flex;
    justify-content: space-between;
    padding: 0 12px;
    margin-top: -2px;
}

.wagon-wheels .wheel[b-dpnfv4vk7x] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #3d4756, #11151c 70%);
    border: 2px solid #2c3442;
    margin-right: -6px;
}

.wagon-wheels .wheel-right[b-dpnfv4vk7x] { margin-left: auto; }

/* sortable states */
.train-wagon-card.sortable-chosen[b-dpnfv4vk7x] {
    cursor: grabbing;
    transform: scale(1.05) translateY(-4px);
}

.train-wagon-card.sortable-ghost[b-dpnfv4vk7x] {
    opacity: 0.35;
}

.train-wagon-card.sortable-ghost .wagon-body[b-dpnfv4vk7x] {
    border-style: dashed;
    border-color: #60a5fa;
}

.train-empty-hint[b-dpnfv4vk7x] {
    color: #7d8aa0;
    font-size: 0.9rem;
    padding: 2.2rem 2rem 2.6rem;
    text-align: center;
    z-index: 1;
    white-space: nowrap;
}

/* ===== Ficha del vagón seleccionado ===== */
.wagon-detail-strip[b-dpnfv4vk7x] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.65rem 0.9rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #0d1626, #14213a);
    border: 1px solid #24364f;
    color: #e2e8f0;
    animation: detail-in-b-dpnfv4vk7x 0.22s ease-out;
}

@keyframes detail-in-b-dpnfv4vk7x {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

.detail-main[b-dpnfv4vk7x] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.detail-pos[b-dpnfv4vk7x] {
    background: #1d4ed8;
    color: #fff;
    font-weight: 800;
    font-size: 0.8rem;
    padding: 0.3rem 0.55rem;
    border-radius: 8px;
    font-family: 'IBM Plex Mono', monospace;
}

.detail-id[b-dpnfv4vk7x] {
    display: flex;
    flex-direction: column;
}

.detail-plate[b-dpnfv4vk7x] {
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 700;
    font-size: 0.95rem;
    color: #fff;
}

.detail-tipo[b-dpnfv4vk7x] {
    font-size: 0.72rem;
    color: #94a3b8;
}

.detail-badges[b-dpnfv4vk7x] {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
}

.detail-obs[b-dpnfv4vk7x] {
    flex: 1;
    min-width: 220px;
}

.detail-obs-text[b-dpnfv4vk7x] {
    font-size: 0.82rem;
    color: #cbd5e1;
    font-style: italic;
}

.detail-close[b-dpnfv4vk7x] {
    border: none;
    background: rgba(255, 255, 255, 0.08);
    color: #94a3b8;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
}

.detail-close:hover[b-dpnfv4vk7x] { background: rgba(255, 255, 255, 0.16); color: #fff; }
.detail-close .material-icons-round[b-dpnfv4vk7x] { font-size: 1.1rem; }

/* ===== Transición entre modos ===== */
.twin-3d-wrap[b-dpnfv4vk7x],
.train-scroll-viewport[b-dpnfv4vk7x] {
    animation: mode-fade-b-dpnfv4vk7x 0.28s ease-out;
}

@keyframes mode-fade-b-dpnfv4vk7x {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

/* ===== Accesibilidad: movimiento reducido ===== */
@media (prefers-reduced-motion: reduce) {
    .train-wagon-card[b-dpnfv4vk7x],
    .twin-3d-wrap[b-dpnfv4vk7x],
    .train-scroll-viewport[b-dpnfv4vk7x],
    .wagon-detail-strip[b-dpnfv4vk7x] {
        animation: none !important;
    }

    .train-wagon-card[b-dpnfv4vk7x],
    .twin-3d-ctrl[b-dpnfv4vk7x],
    .view-btn[b-dpnfv4vk7x] {
        transition: none !important;
    }

    .led-issue[b-dpnfv4vk7x] { animation: none !important; }
}
/* /Pages/Maps/WagonMapShowDialog.razor.rz.scp.css */
/* Lenguaje visual de marca (estilo "¿Dónde está mi vagón?") aplicado al modal de situación. */
.rs-wagon-modal[b-y0jw95ezrc] {
    --rs-primary: #420134;
}

/* Pestaña activa en color de marca (cosmético; si Radzen cambia clases, no rompe nada). */
.rs-wagon-modal[b-y0jw95ezrc]  .rz-tabview-nav li.rz-state-active a,
.rs-wagon-modal[b-y0jw95ezrc]  .rz-tabview-nav li.rz-tabview-selected a,
.rs-wagon-modal[b-y0jw95ezrc]  .rz-tabview-nav li.rz-state-active .rz-tabview-title {
    color: #420134;
    font-weight: 700;
}

.rs-wagon-modal[b-y0jw95ezrc]  .rz-tabview-nav li.rz-state-active,
.rs-wagon-modal[b-y0jw95ezrc]  .rz-tabview-nav li.rz-tabview-selected {
    border-bottom: 2px solid #420134;
}

/* La tarjeta del modal sin sombra extra (el diálogo ya aporta el contenedor). */
.rs-wagon-modal[b-y0jw95ezrc]  .rz-card {
    box-shadow: none;
    border: none;
}
/* /Pages/Users/CreateUserDialog.razor.rz.scp.css */
/* ============================================
   CreateUserDialog — Scoped CSS
   ============================================ */

.dialog-container[b-auswv0rc6z] {
    padding: 0.5rem 0;
}

/* ===== SECTIONS ===== */
.dialog-section[b-auswv0rc6z] {
    margin-bottom: 1.5rem;
}

.role-hint[b-auswv0rc6z] {
    margin: 0 0 0.75rem;
    font-size: 0.85rem;
    color: #64748b;
}

.admin-role-notice[b-auswv0rc6z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    background: #f5f3ff;
    color: #5b21b6;
    font-size: 0.9rem;
}

.dialog-section-header[b-auswv0rc6z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
}

.dialog-section-icon[b-auswv0rc6z] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.section-icon-person[b-auswv0rc6z] { background: var(--rs-primary-subtle, #f5eaf3); color: var(--rs-primary, #631656); }
.section-icon-lock[b-auswv0rc6z]   { background: #fef3c7; color: #d97706; }
.section-icon-shield[b-auswv0rc6z] { background: #ecfdf5; color: #059669; }

.dialog-section-title[b-auswv0rc6z] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ===== ROLE CARDS ===== */
.role-cards[b-auswv0rc6z] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.role-card[b-auswv0rc6z] {
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    padding: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    text-align: center;
    background: #fff;
    user-select: none;
}

.role-card:hover[b-auswv0rc6z] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.role-card.selected[b-auswv0rc6z] {
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}

.role-card.selected.gestor[b-auswv0rc6z] {
    border-color: #0891b2;
    background: #ecfeff;
}

.role-card.selected.operador[b-auswv0rc6z] {
    border-color: #059669;
    background: #ecfdf5;
}

.role-card.selected.usuario[b-auswv0rc6z] {
    border-color: #6366f1;
    background: #eef2ff;
}

.role-card.selected.visor[b-auswv0rc6z] {
    border-color: #52525b;
    background: #f4f4f5;
}

.role-card.selected.eem[b-auswv0rc6z] {
    border-color: #d97706;
    background: #fff7ed;
}

.role-card.selected.eem .role-card-icon[b-auswv0rc6z] {
    background: #d97706;
    color: #fff;
}

/* Selector de ámbito (empresa ferroviaria / taller) */
.scope-field[b-auswv0rc6z] {
    margin-top: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.scope-hint[b-auswv0rc6z] {
    font-size: 0.78rem;
    color: #6b7280;
}

.role-card-icon[b-auswv0rc6z] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.2s ease;
}

.role-card .role-card-icon[b-auswv0rc6z] {
    background: #f1f5f9;
    color: #94a3b8;
}

.role-card.selected.gestor .role-card-icon[b-auswv0rc6z] {
    background: #0891b2;
    color: #fff;
}

.role-card.selected.operador .role-card-icon[b-auswv0rc6z] {
    background: #059669;
    color: #fff;
}

.role-card.selected.usuario .role-card-icon[b-auswv0rc6z] {
    background: #6366f1;
    color: #fff;
}

.role-card.selected.visor .role-card-icon[b-auswv0rc6z] {
    background: #52525b;
    color: #fff;
}

.role-card-name[b-auswv0rc6z] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1e293b;
}

.role-card-desc[b-auswv0rc6z] {
    font-size: 0.68rem;
    color: #94a3b8;
    line-height: 1.3;
}

/* ===== PASSWORD STRENGTH ===== */
.password-strength-bar[b-auswv0rc6z] {
    height: 3px;
    border-radius: 3px;
    background: #e5e7eb;
    margin-top: 4px;
    overflow: hidden;
}

.password-strength-fill[b-auswv0rc6z] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease, background 0.3s ease;
}

.strength-weak[b-auswv0rc6z]   { width: 25%; background: #ef4444; }
.strength-fair[b-auswv0rc6z]   { width: 50%; background: #f59e0b; }
.strength-good[b-auswv0rc6z]   { width: 75%; background: #22c55e; }
.strength-strong[b-auswv0rc6z] { width: 100%; background: #16a34a; }

.strength-label[b-auswv0rc6z] {
    font-size: 0.65rem;
    margin-top: 2px;
    font-weight: 500;
}

.strength-label.weak[b-auswv0rc6z]   { color: #ef4444; }
.strength-label.fair[b-auswv0rc6z]   { color: #f59e0b; }
.strength-label.good[b-auswv0rc6z]   { color: #22c55e; }
.strength-label.strong[b-auswv0rc6z] { color: #16a34a; }

/* ===== ERROR ALERT ===== */
.error-alert[b-auswv0rc6z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.625rem 0.875rem;
    margin-top: 1rem;
    color: #dc2626;
    font-size: 0.8rem;
    font-weight: 500;
    animation: shake-b-auswv0rc6z 0.3s ease;
}

@keyframes shake-b-auswv0rc6z {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

.error-alert-icon[b-auswv0rc6z] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ===== FOOTER ===== */
.dialog-footer[b-auswv0rc6z] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid #f1f5f9;
    margin-top: 0.5rem;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 480px) {
    .role-cards[b-auswv0rc6z] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Users/EditUserDialog.razor.rz.scp.css */
/* ============================================
   EditUserDialog — Scoped CSS
   ============================================ */

.dialog-container[b-06e6hn6ixx] {
    padding: 0.5rem 0;
}

.role-hint[b-06e6hn6ixx] {
    margin: 0 0 0.75rem;
    font-size: 0.85rem;
    color: #64748b;
}

.admin-role-notice[b-06e6hn6ixx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    background: #f5f3ff;
    color: #5b21b6;
    font-size: 0.9rem;
}

/* ===== USER HEADER ===== */
.dialog-user-header[b-06e6hn6ixx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    padding: 0.875rem 1rem;
    background: #f8fafc;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
}

.dialog-user-avatar[b-06e6hn6ixx] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rs-primary, #631656), var(--rs-primary-light, #8b3d7c));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    flex-shrink: 0;
}

.dialog-user-info[b-06e6hn6ixx] {
    display: flex;
    flex-direction: column;
}

.dialog-user-name[b-06e6hn6ixx] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #1e293b;
}

.dialog-user-email[b-06e6hn6ixx] {
    font-size: 0.8rem;
    color: #94a3b8;
}

/* ===== SECTIONS ===== */
.dialog-section[b-06e6hn6ixx] {
    margin-bottom: 1.5rem;
}

.dialog-section-header[b-06e6hn6ixx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
}

.dialog-section-icon[b-06e6hn6ixx] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.section-icon-person[b-06e6hn6ixx] { background: var(--rs-primary-subtle, #f5eaf3); color: var(--rs-primary, #631656); }
.section-icon-lock[b-06e6hn6ixx]   { background: #fef3c7; color: #d97706; }
.section-icon-shield[b-06e6hn6ixx] { background: #ecfdf5; color: #059669; }

.dialog-section-title[b-06e6hn6ixx] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ===== ROLE CARDS ===== */
.role-cards[b-06e6hn6ixx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.role-card[b-06e6hn6ixx] {
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    padding: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    text-align: center;
    background: #fff;
    user-select: none;
}

.role-card:hover[b-06e6hn6ixx] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.role-card.selected[b-06e6hn6ixx] {
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}

.role-card.selected.gestor[b-06e6hn6ixx]   { border-color: #0891b2; background: #ecfeff; }
.role-card.selected.operador[b-06e6hn6ixx] { border-color: #059669; background: #ecfdf5; }
.role-card.selected.usuario[b-06e6hn6ixx]  { border-color: #6366f1; background: #eef2ff; }
.role-card.selected.visor[b-06e6hn6ixx]    { border-color: #52525b; background: #f4f4f5; }
.role-card.selected.eem[b-06e6hn6ixx]      { border-color: #d97706; background: #fff7ed; }

.role-card-icon[b-06e6hn6ixx] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.2s ease;
}

.role-card .role-card-icon[b-06e6hn6ixx]                   { background: #f1f5f9; color: #94a3b8; }
.role-card.selected.gestor .role-card-icon[b-06e6hn6ixx]   { background: #0891b2; color: #fff; }
.role-card.selected.operador .role-card-icon[b-06e6hn6ixx] { background: #059669; color: #fff; }
.role-card.selected.usuario .role-card-icon[b-06e6hn6ixx]  { background: #6366f1; color: #fff; }
.role-card.selected.visor .role-card-icon[b-06e6hn6ixx]    { background: #52525b; color: #fff; }
.role-card.selected.eem .role-card-icon[b-06e6hn6ixx]      { background: #d97706; color: #fff; }

/* Selector de ámbito (empresa ferroviaria / taller) */
.scope-field[b-06e6hn6ixx] { margin-top: 0.85rem; display: flex; flex-direction: column; gap: 0.3rem; }
.scope-hint[b-06e6hn6ixx] { font-size: 0.78rem; color: #6b7280; }

.role-card-name[b-06e6hn6ixx] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1e293b;
}

.role-card-desc[b-06e6hn6ixx] {
    font-size: 0.68rem;
    color: #94a3b8;
    line-height: 1.3;
}

/* ===== PASSWORD HINT ===== */
.password-hint[b-06e6hn6ixx] {
    font-size: 0.72rem;
    color: #94a3b8;
    font-style: italic;
    margin-top: 4px;
}

/* ===== PASSWORD STRENGTH ===== */
.password-strength-bar[b-06e6hn6ixx] {
    height: 3px;
    border-radius: 3px;
    background: #e5e7eb;
    margin-top: 4px;
    overflow: hidden;
}

.password-strength-fill[b-06e6hn6ixx] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease, background 0.3s ease;
}

.strength-weak[b-06e6hn6ixx]   { width: 25%; background: #ef4444; }
.strength-fair[b-06e6hn6ixx]   { width: 50%; background: #f59e0b; }
.strength-good[b-06e6hn6ixx]   { width: 75%; background: #22c55e; }
.strength-strong[b-06e6hn6ixx] { width: 100%; background: #16a34a; }

.strength-label[b-06e6hn6ixx] {
    font-size: 0.65rem;
    margin-top: 2px;
    font-weight: 500;
}

.strength-label.weak[b-06e6hn6ixx]   { color: #ef4444; }
.strength-label.fair[b-06e6hn6ixx]   { color: #f59e0b; }
.strength-label.good[b-06e6hn6ixx]   { color: #22c55e; }
.strength-label.strong[b-06e6hn6ixx] { color: #16a34a; }

/* ===== ERROR ALERT ===== */
.error-alert[b-06e6hn6ixx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.625rem 0.875rem;
    margin-top: 1rem;
    color: #dc2626;
    font-size: 0.8rem;
    font-weight: 500;
    animation: shake-b-06e6hn6ixx 0.3s ease;
}

@keyframes shake-b-06e6hn6ixx {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

.error-alert-icon[b-06e6hn6ixx] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* ===== FOOTER ===== */
.dialog-footer[b-06e6hn6ixx] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid #f1f5f9;
    margin-top: 0.5rem;
}

/* ===== SKELETON ===== */
.skeleton[b-06e6hn6ixx] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-06e6hn6ixx 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-06e6hn6ixx {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-form[b-06e6hn6ixx] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 0;
}

.skeleton-row[b-06e6hn6ixx] {
    display: flex;
    gap: 1rem;
}

.skeleton-field[b-06e6hn6ixx] {
    height: 48px;
    flex: 1;
    border-radius: 8px;
}

.skeleton-roles[b-06e6hn6ixx] {
    display: flex;
    gap: 0.75rem;
}

.skeleton-role-card[b-06e6hn6ixx] {
    height: 90px;
    flex: 1;
    border-radius: 10px;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 480px) {
    .role-cards[b-06e6hn6ixx] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Users/PermissionsMatrix.razor.rz.scp.css */
/* ============================================
   PermissionsMatrix — Scoped CSS
   Design system aligned with Dashboard.razor.css
   ============================================ */

/* Skeleton */
.skeleton[b-kob8xd3tg2] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-kob8xd3tg2 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-kob8xd3tg2 {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.panel-fade-in[b-kob8xd3tg2] {
    animation: panel-fade-in-b-kob8xd3tg2 0.3s ease-out;
}

@keyframes panel-fade-in-b-kob8xd3tg2 {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== HEADER ===== */
.permissions-header[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.permissions-header-left[b-kob8xd3tg2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.permissions-title-row[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.permissions-title-icon[b-kob8xd3tg2] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--rs-primary-subtle, #f5eaf3);
    color: var(--rs-primary, #631656);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.permissions-title[b-kob8xd3tg2] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.permissions-subtitle[b-kob8xd3tg2] {
    font-size: 0.8rem;
    color: #94a3b8;
    margin: 0;
    padding-left: 2.75rem;
}

.permissions-header-actions[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.changes-badge[b-kob8xd3tg2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.72rem;
    font-weight: 600;
    background: #fef3c7;
    color: #d97706;
}

/* ===== LEGEND ===== */
.role-legend[b-kob8xd3tg2] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.role-legend-item[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
}

.role-legend-dot[b-kob8xd3tg2] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dot-admin[b-kob8xd3tg2]    { background: var(--rs-primary, #631656); }
.dot-gestor[b-kob8xd3tg2]   { background: #0891b2; }
.dot-operador[b-kob8xd3tg2] { background: #059669; }
.dot-usuario[b-kob8xd3tg2]  { background: #6366f1; }
.dot-visor[b-kob8xd3tg2]    { background: #52525b; }

/* ===== TABLE CARD ===== */
.permissions-card[b-kob8xd3tg2] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    overflow: hidden;
}

.permissions-table-wrapper[b-kob8xd3tg2] {
    overflow-x: auto;
}

/* ===== TABLE ===== */
.permissions-table[b-kob8xd3tg2] {
    width: 100%;
    min-width: 700px;
    border-collapse: collapse;
}

.permissions-table thead th[b-kob8xd3tg2] {
    padding: 0.75rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    text-align: center;
    white-space: nowrap;
    background: #f8fafc;
    border-bottom: 2px solid #e5e7eb;
}

.permissions-table thead th:first-child[b-kob8xd3tg2] {
    text-align: left;
    padding-left: 1rem;
    min-width: 200px;
}

/* Role header badge */
.role-header-badge[b-kob8xd3tg2] {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 8px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.badge-gestor[b-kob8xd3tg2]   { background: #0891b2; color: #fff; }
.badge-operador[b-kob8xd3tg2] { background: #059669; color: #fff; }
.badge-usuario[b-kob8xd3tg2]  { background: #6366f1; color: #fff; }
.badge-visor[b-kob8xd3tg2]    { background: #52525b; color: #e4e4e7; }
.badge-admin[b-kob8xd3tg2]    { background: var(--rs-primary, #631656); color: #fff; }

/* Sub header (Ver/Crear/Editar/Borrar) */
.sub-header-row th[b-kob8xd3tg2] {
    background: #fafafa !important;
    font-size: 0.68rem !important;
    color: #94a3b8 !important;
    font-weight: 500 !important;
    padding: 0.4rem 0.5rem !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Role separator */
.role-separator[b-kob8xd3tg2] {
    border-left: 2px solid #e5e7eb;
}

/* ===== ADMIN ROW ===== */
.admin-row[b-kob8xd3tg2] {
    background: #f5f3ff;
}

.admin-row td[b-kob8xd3tg2] {
    padding: 0.625rem 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.admin-label[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: #7c3aed;
    padding-left: 0.5rem;
}

.admin-check[b-kob8xd3tg2] {
    color: #818cf8;
    font-size: 1rem;
    opacity: 0.7;
}

/* ===== MODULE ROWS ===== */
.module-row[b-kob8xd3tg2] {
    transition: background 0.15s ease;
}

.module-row:hover[b-kob8xd3tg2] {
    background: #f8fafc;
}

.module-row td[b-kob8xd3tg2] {
    padding: 0.625rem 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    text-align: center;
    vertical-align: middle;
}

.module-row td:first-child[b-kob8xd3tg2] {
    text-align: left;
    padding-left: 1rem;
}

/* Zebra striping */
.module-row:nth-child(even)[b-kob8xd3tg2] {
    background: #fafbfc;
}

.module-row:nth-child(even):hover[b-kob8xd3tg2] {
    background: #f1f5f9;
}

/* Module cell */
.module-cell[b-kob8xd3tg2] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.module-icon[b-kob8xd3tg2] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: #f1f5f9;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.module-name[b-kob8xd3tg2] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #1e293b;
}

/* ===== SKELETON TABLE ===== */
.skeleton-table[b-kob8xd3tg2] {
    height: 400px;
    border-radius: 10px;
}

/* ===== SUCCESS ANIMATION ===== */
@keyframes save-flash-b-kob8xd3tg2 {
    0%   { box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
    50%  { box-shadow: 0 0 0 3px rgba(22,163,74,0.3); }
    100% { box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
}

.save-success[b-kob8xd3tg2] {
    animation: save-flash-b-kob8xd3tg2 0.6s ease;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .permissions-header[b-kob8xd3tg2] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Pages/Users/UserProfile.razor.rz.scp.css */
/* ============================================
   UserProfile — Scoped CSS
   Design system aligned with Dashboard.razor.css
   ============================================ */

/* Skeleton shimmer animation */
.skeleton[b-0tbex5ud4a] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-0tbex5ud4a 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-0tbex5ud4a {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Fade-in animation */
.panel-fade-in[b-0tbex5ud4a] {
    animation: panel-fade-in-b-0tbex5ud4a 0.3s ease-out;
}

@keyframes panel-fade-in-b-0tbex5ud4a {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Container */
.profile-container[b-0tbex5ud4a] {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 1rem 2rem;
}

/* ===== BANNER ===== */
.profile-banner[b-0tbex5ud4a] {
    background: var(--rs-primary-gradient, linear-gradient(135deg, #631656, #8b3d7c));
    border-radius: 12px;
    padding: 2.5rem 2rem 1.5rem;
    text-align: center;
    position: relative;
    margin-bottom: 3rem;
    box-shadow: 0 4px 20px rgba(67, 64, 210, 0.25);
}

.profile-avatar[b-0tbex5ud4a] {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    backdrop-filter: blur(10px);
    border: 3px solid rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.75rem;
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 1px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.profile-name[b-0tbex5ud4a] {
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 0.25rem;
}

.profile-username[b-0tbex5ud4a] {
    color: rgba(255,255,255,0.7);
    font-size: 0.9rem;
    margin: 0 0 0.75rem;
}

.profile-role-badges[b-0tbex5ud4a] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.profile-role-badge[b-0tbex5ud4a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    background: rgba(255,255,255,0.2);
    color: #fff;
    backdrop-filter: blur(6px);
}

/* ===== KPI ROW ===== */
.profile-kpi-row[b-0tbex5ud4a] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.profile-kpi-card[b-0tbex5ud4a] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-left: 4px solid transparent;
    transition: box-shadow 0.2s, transform 0.15s;
}

.profile-kpi-card:hover[b-0tbex5ud4a] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    transform: translateY(-2px);
}

.kpi-access[b-0tbex5ud4a]   { border-left-color: #2563eb; }
.kpi-role[b-0tbex5ud4a]     { border-left-color: var(--rs-primary, #631656); }
.kpi-member[b-0tbex5ud4a]   { border-left-color: #16a34a; }

.profile-kpi-icon[b-0tbex5ud4a] {
    font-size: 1.5rem;
    opacity: 0.75;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}

.kpi-access .profile-kpi-icon[b-0tbex5ud4a]   { color: #2563eb; background: #eff6ff; }
.kpi-role .profile-kpi-icon[b-0tbex5ud4a]     { color: var(--rs-primary, #631656); background: var(--rs-primary-subtle, #f5eaf3); }
.kpi-member .profile-kpi-icon[b-0tbex5ud4a]   { color: #16a34a; background: #f0fdf4; }

.profile-kpi-content[b-0tbex5ud4a] {
    display: flex;
    flex-direction: column;
}

.profile-kpi-value[b-0tbex5ud4a] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.2;
}

.profile-kpi-label[b-0tbex5ud4a] {
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}

/* ===== CARDS ===== */
.profile-card[b-0tbex5ud4a] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}

.profile-section-header[b-0tbex5ud4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.profile-section-icon[b-0tbex5ud4a] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.section-icon-person[b-0tbex5ud4a]  { background: var(--rs-primary-subtle, #f5eaf3); color: var(--rs-primary, #631656); }
.section-icon-lock[b-0tbex5ud4a]    { background: #fef3c7; color: #d97706; }
.section-icon-history[b-0tbex5ud4a] { background: #ecfdf5; color: #059669; }

.profile-section-title[b-0tbex5ud4a] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

/* ===== FIELDS GRID ===== */
.profile-fields-grid[b-0tbex5ud4a] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem 2rem;
}

.profile-field[b-0tbex5ud4a] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.profile-field-row[b-0tbex5ud4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.profile-field-icon[b-0tbex5ud4a] {
    font-size: 1rem;
    color: #94a3b8;
    flex-shrink: 0;
}

.profile-field-label[b-0tbex5ud4a] {
    font-size: 0.7rem;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
}

.profile-field-value[b-0tbex5ud4a] {
    font-size: 0.95rem;
    color: #1e293b;
    font-weight: 500;
    padding-left: 1.5rem;
}

/* ===== PASSWORD FORM ===== */
.password-form-container[b-0tbex5ud4a] {
    max-width: 420px;
}

.password-field[b-0tbex5ud4a] {
    margin-bottom: 1rem;
}

.password-strength-bar[b-0tbex5ud4a] {
    height: 4px;
    border-radius: 4px;
    background: #e5e7eb;
    margin-top: 6px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.password-strength-fill[b-0tbex5ud4a] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease, background 0.3s ease;
}

.strength-weak[b-0tbex5ud4a]   { width: 25%; background: #ef4444; }
.strength-fair[b-0tbex5ud4a]   { width: 50%; background: #f59e0b; }
.strength-good[b-0tbex5ud4a]   { width: 75%; background: #22c55e; }
.strength-strong[b-0tbex5ud4a] { width: 100%; background: #16a34a; }

.strength-text[b-0tbex5ud4a] {
    font-size: 0.7rem;
    margin-top: 4px;
    font-weight: 500;
}

.strength-text.weak[b-0tbex5ud4a]   { color: #ef4444; }
.strength-text.fair[b-0tbex5ud4a]   { color: #f59e0b; }
.strength-text.good[b-0tbex5ud4a]   { color: #22c55e; }
.strength-text.strong[b-0tbex5ud4a] { color: #16a34a; }

.password-submit-btn[b-0tbex5ud4a] {
    margin-top: 0.5rem;
}

/* ===== ACTIVITY GRID ===== */
.activity-empty[b-0tbex5ud4a] {
    text-align: center;
    padding: 2rem 1rem;
    color: #94a3b8;
}

.activity-empty-icon[b-0tbex5ud4a] {
    font-size: 2.5rem;
    opacity: 0.4;
    margin-bottom: 0.5rem;
    display: block;
}

.activity-empty-text[b-0tbex5ud4a] {
    font-size: 0.9rem;
    font-style: italic;
}

.action-badge[b-0tbex5ud4a] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.72rem;
    font-weight: 600;
}

.action-crear[b-0tbex5ud4a]    { background: #f0fdf4; color: #16a34a; }
.action-editar[b-0tbex5ud4a]   { background: #eff6ff; color: #2563eb; }
.action-eliminar[b-0tbex5ud4a] { background: #fef2f2; color: #dc2626; }
.action-consultar[b-0tbex5ud4a] { background: #f8fafc; color: #64748b; }

/* ===== SKELETON ===== */
.skeleton-banner[b-0tbex5ud4a] {
    height: 200px;
    border-radius: 12px;
    margin-bottom: 3rem;
}

.skeleton-kpi[b-0tbex5ud4a] {
    height: 72px;
    border-radius: 10px;
}

.skeleton-card[b-0tbex5ud4a] {
    height: 160px;
    border-radius: 10px;
    margin-bottom: 1.25rem;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .profile-banner[b-0tbex5ud4a] {
        padding: 2rem 1rem 1.25rem;
    }

    .profile-avatar[b-0tbex5ud4a] {
        width: 72px;
        height: 72px;
        font-size: 1.6rem;
    }

    .profile-kpi-row[b-0tbex5ud4a] {
        grid-template-columns: 1fr;
    }

    .profile-fields-grid[b-0tbex5ud4a] {
        grid-template-columns: 1fr;
    }

    .profile-card[b-0tbex5ud4a] {
        padding: 1rem;
    }
}

@media (max-width: 480px) {
    .profile-container[b-0tbex5ud4a] {
        padding: 0 0.5rem 1.5rem;
    }

    .profile-name[b-0tbex5ud4a] {
        font-size: 1.2rem;
    }
}
/* /Pages/Users/Users.razor.rz.scp.css */
/* ============================================
   Users — Scoped CSS
   Design system aligned with Dashboard.razor.css
   ============================================ */

/* Skeleton */
.skeleton[b-7vf996pa1i] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-7vf996pa1i 1.5s infinite;
    border-radius: 6px;
}

@keyframes skeleton-shimmer-b-7vf996pa1i {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.panel-fade-in[b-7vf996pa1i] {
    animation: panel-fade-in-b-7vf996pa1i 0.3s ease-out;
}

@keyframes panel-fade-in-b-7vf996pa1i {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== KPI ROW ===== */
.users-kpi-row[b-7vf996pa1i] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.users-kpi-card[b-7vf996pa1i] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-left: 4px solid transparent;
    transition: box-shadow 0.2s, transform 0.15s;
}

.users-kpi-card:hover[b-7vf996pa1i] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    transform: translateY(-2px);
}

.kpi-total[b-7vf996pa1i]    { border-left-color: var(--rs-primary, #631656); }
.kpi-active[b-7vf996pa1i]   { border-left-color: #16a34a; }
.kpi-inactive[b-7vf996pa1i] { border-left-color: #ef4444; }
.kpi-admins[b-7vf996pa1i]   { border-left-color: #d97706; }

.users-kpi-icon[b-7vf996pa1i] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.kpi-total .users-kpi-icon[b-7vf996pa1i]    { color: var(--rs-primary, #631656); background: var(--rs-primary-subtle, #f5eaf3); }
.kpi-active .users-kpi-icon[b-7vf996pa1i]   { color: #16a34a; background: #f0fdf4; }
.kpi-inactive .users-kpi-icon[b-7vf996pa1i] { color: #ef4444; background: #fef2f2; }
.kpi-admins .users-kpi-icon[b-7vf996pa1i]   { color: #d97706; background: #fffbeb; }

.users-kpi-content[b-7vf996pa1i] {
    display: flex;
    flex-direction: column;
}

.users-kpi-value[b-7vf996pa1i] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.1;
}

.users-kpi-label[b-7vf996pa1i] {
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}

.skeleton-kpi[b-7vf996pa1i] {
    height: 72px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* ===== SEARCH BAR ===== */
.users-search-bar[b-7vf996pa1i] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 0.875rem 1.25rem;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.search-input-wrapper[b-7vf996pa1i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 200px;
}

.search-icon[b-7vf996pa1i] {
    color: #94a3b8;
    font-size: 1.2rem;
}

.search-actions[b-7vf996pa1i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ===== DATA GRID CARD ===== */
.users-grid-card[b-7vf996pa1i] {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 10px;
    padding: 0.25rem 0;
    overflow: hidden;
}

/* ===== USER CELL ===== */
.user-cell[b-7vf996pa1i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.user-avatar[b-7vf996pa1i] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--rs-primary, #631656), var(--rs-primary-light, #8b3d7c));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    flex-shrink: 0;
    position: relative;
}

.avatar-status-ring[b-7vf996pa1i] {
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    border: 2px solid #fff;
}

.ring-active[b-7vf996pa1i]   { background: #22c55e; }
.ring-inactive[b-7vf996pa1i] { background: #a1a1aa; }

.user-info[b-7vf996pa1i] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.user-name[b-7vf996pa1i] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-username[b-7vf996pa1i] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* ===== ROLE BADGE ===== */
.role-badge[b-7vf996pa1i] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.role-admin[b-7vf996pa1i]    { background: var(--rs-primary, #631656); color: #fff; }
.role-gestor[b-7vf996pa1i]   { background: #0891b2; color: #fff; }
.role-operador[b-7vf996pa1i] { background: #059669; color: #fff; }
.role-usuario[b-7vf996pa1i]  { background: #6366f1; color: #fff; }
.role-legacy[b-7vf996pa1i]   { background: #fef3c7; color: #92400e; border: 1px solid #fcd34d; }
.role-visor[b-7vf996pa1i]    { background: #52525b; color: #e4e4e7; }
.role-default[b-7vf996pa1i]  { background: #27272a; color: #a1a1aa; }
.role-none[b-7vf996pa1i]     { color: #94a3b8; font-size: 0.75rem; font-style: italic; }

/* ===== STATUS ===== */
.status-indicator[b-7vf996pa1i] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-dot[b-7vf996pa1i] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dot-active[b-7vf996pa1i]   { background: #22c55e; }
.dot-inactive[b-7vf996pa1i] { background: #ef4444; }

.status-active[b-7vf996pa1i]   { color: #16a34a; }
.status-inactive[b-7vf996pa1i] { color: #ef4444; }

/* ===== LAST LOGIN ===== */
.last-login[b-7vf996pa1i] {
    color: #94a3b8;
    font-size: 0.8rem;
}

.last-login-never[b-7vf996pa1i] {
    color: #d1d5db;
    font-size: 0.8rem;
    font-style: italic;
}

/* ===== ACTION BUTTONS ===== */
.action-btn-group[b-7vf996pa1i] {
    display: flex;
    gap: 4px;
}

/* ===== EMPTY STATE ===== */
.empty-state[b-7vf996pa1i] {
    text-align: center;
    padding: 3rem 1rem;
}

.empty-state-icon[b-7vf996pa1i] {
    font-size: 3rem;
    color: #d1d5db;
    display: block;
    margin-bottom: 0.75rem;
}

.empty-state-title[b-7vf996pa1i] {
    font-size: 1rem;
    font-weight: 600;
    color: #64748b;
    margin: 0 0 0.25rem;
}

.empty-state-sub[b-7vf996pa1i] {
    font-size: 0.85rem;
    color: #94a3b8;
    margin: 0;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .users-kpi-row[b-7vf996pa1i] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .users-kpi-row[b-7vf996pa1i] {
        grid-template-columns: 1fr;
    }

    .users-search-bar[b-7vf996pa1i] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-actions[b-7vf996pa1i] {
        justify-content: flex-end;
    }
}
/* /Pages/Wagons/WagonLocator.razor.rz.scp.css */
.rs-locator-page[b-0ukp8ztb6w] {
    --rs-primary: #420134;
    --rs-primary-container: #5d1a4b;
    --rs-secondary: #92407d;
    --rs-secondary-container: #fd9cdf;
    --rs-on-secondary-container: #7b2c69;
    --rs-on-primary-container: #d783b9;
    --rs-surface: #f9f9fb;
    --rs-surface-bright: #f9f9fb;
    --rs-surface-container: #eeeef0;
    --rs-surface-container-high: #e8e8ea;
    --rs-surface-container-low: #f3f3f5;
    --rs-surface-dim: #d9dadc;
    --rs-outline-variant: #d5c1ca;
    --rs-on-surface: #1a1c1d;
    --rs-on-surface-variant: #51434a;
    --rs-error: #ba1a1a;
    --rs-error-container: #ffdad6;

    min-height: calc(100vh - 48px);
    margin: -1rem -1.5rem;
    position: relative;
    background: var(--rs-surface-dim);
    overflow: hidden;
}

.rs-locator-bg[b-0ukp8ztb6w] {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    background:
        linear-gradient(135deg, #e8f0e8 0%, #d4e4d4 30%, #c8d8c0 60%, #b8c8b0 100%);
    filter: grayscale(0.6);
}

.rs-locator-overlay[b-0ukp8ztb6w] {
    position: relative;
    z-index: 1;
    min-height: calc(100vh - 48px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(4px);
}

.rs-locator-modal[b-0ukp8ztb6w] {
    width: 100%;
    max-width: 72rem;
    max-height: calc(100vh - 96px);
    background: #fff;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.5rem;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rs-locator-header[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    background: var(--rs-primary);
    color: #fff;
}

.rs-locator-header h1[b-0ukp8ztb6w] {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.rs-locator-close[b-0ukp8ztb6w] {
    background: transparent;
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}

.rs-locator-close:hover[b-0ukp8ztb6w] {
    background: rgba(255, 255, 255, 0.1);
}

.rs-locator-search[b-0ukp8ztb6w] {
    padding: 1.5rem 2rem;
    border-bottom: 1px solid var(--rs-outline-variant);
    background: var(--rs-surface-bright);
}

.rs-locator-search-inner[b-0ukp8ztb6w] {
    max-width: 42rem;
    margin: 0 auto;
    display: flex;
    gap: 0.75rem;
}

.rs-locator-search-field[b-0ukp8ztb6w] {
    flex: 1;
    position: relative;
}

.rs-locator-search-field .material-icons-round[b-0ukp8ztb6w] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rs-on-surface-variant);
    font-size: 20px;
}

.rs-locator-search-field input[b-0ukp8ztb6w] {
    width: 100%;
    padding: 0.5rem 1rem 0.5rem 2.5rem;
    border: none;
    border-radius: 0.25rem;
    background: var(--rs-surface-container);
    font-size: 0.875rem;
    outline: none;
}

.rs-locator-search-field input:focus[b-0ukp8ztb6w] {
    box-shadow: 0 0 0 2px var(--rs-primary);
}

.rs-locator-search-btn[b-0ukp8ztb6w] {
    background: var(--rs-primary);
    color: #fff;
    border: none;
    border-radius: 0.25rem;
    padding: 0.5rem 1.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    cursor: pointer;
    white-space: nowrap;
}

.rs-locator-search-btn:disabled[b-0ukp8ztb6w] {
    opacity: 0.6;
    cursor: not-allowed;
}

.rs-locator-body[b-0ukp8ztb6w] {
    flex: 1;
    overflow-y: auto;
    padding: 2rem;
}

.rs-locator-body[b-0ukp8ztb6w]::-webkit-scrollbar { width: 4px; }
.rs-locator-body[b-0ukp8ztb6w]::-webkit-scrollbar-thumb { background: var(--rs-outline-variant); border-radius: 10px; }

.rs-locator-grid[b-0ukp8ztb6w] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 1024px) {
    .rs-locator-grid[b-0ukp8ztb6w] {
        grid-template-columns: 1fr 2fr;
    }
}

.rs-locator-col[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.rs-locator-card[b-0ukp8ztb6w] {
    background: #fff;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.rs-locator-card-header[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.rs-locator-label[b-0ukp8ztb6w] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-primary);
}

.rs-locator-badge[b-0ukp8ztb6w] {
    font-size: 0.625rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
}

.rs-locator-badge-active[b-0ukp8ztb6w] {
    background: var(--rs-secondary-container);
    color: var(--rs-on-secondary-container);
}

.rs-locator-badge-inactive[b-0ukp8ztb6w] {
    background: var(--rs-surface-container-high);
    color: var(--rs-on-surface-variant);
}

.rs-locator-stat-row[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
}

.rs-locator-stat-left[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.rs-locator-stat-left .material-icons-round[b-0ukp8ztb6w] {
    color: var(--rs-on-surface-variant);
    font-size: 20px;
}

.rs-locator-stat-right[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 700;
}

.rs-locator-battery-bar[b-0ukp8ztb6w] {
    width: 3rem;
    height: 0.5rem;
    background: var(--rs-surface-container);
    border-radius: 999px;
    overflow: hidden;
}

.rs-locator-battery-fill[b-0ukp8ztb6w] {
    height: 100%;
    border-radius: 999px;
    transition: width 0.3s;
}

.rs-locator-gps-dot[b-0ukp8ztb6w] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    animation: rs-locator-pulse-b-0ukp8ztb6w 2s infinite;
}

.rs-locator-gps-dot.online[b-0ukp8ztb6w] { background: #16a34a; }
.rs-locator-gps-dot.offline[b-0ukp8ztb6w] { background: #94a3b8; animation: none; }

@keyframes rs-locator-pulse-b-0ukp8ztb6w {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.rs-locator-mono[b-0ukp8ztb6w] {
    font-family: 'IBM Plex Mono', 'Consolas', monospace;
    font-size: 0.8125rem;
    color: var(--rs-on-surface-variant);
}

.rs-locator-empty[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    gap: 0.75rem;
    border: 2px dashed var(--rs-surface-container);
    border-radius: 0.25rem;
    text-align: center;
}

.rs-locator-empty .material-icons-round[b-0ukp8ztb6w] {
    font-size: 2.5rem;
    color: var(--rs-outline-variant);
    font-weight: 200;
}

.rs-locator-empty p[b-0ukp8ztb6w] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--rs-on-surface-variant);
}

.rs-locator-empty small[b-0ukp8ztb6w] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    opacity: 0.4;
}

.rs-locator-tech-grid[b-0ukp8ztb6w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.rs-locator-tech-grid p[b-0ukp8ztb6w] {
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    font-weight: 700;
}

.rs-locator-tech-grid small[b-0ukp8ztb6w] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-on-surface-variant);
}

.rs-locator-timeline-card[b-0ukp8ztb6w] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    min-height: 400px;
}

.rs-locator-timeline-header[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.rs-locator-timeline-title[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.rs-locator-timeline-title span:last-child[b-0ukp8ztb6w] {
    font-size: 0.875rem;
    font-weight: 700;
}

.rs-locator-divider[b-0ukp8ztb6w] {
    width: 1px;
    height: 1rem;
    background: var(--rs-outline-variant);
}

.rs-locator-timeline[b-0ukp8ztb6w] {
    position: relative;
    padding-left: 2rem;
    flex: 1;
}

.rs-locator-timeline-line[b-0ukp8ztb6w] {
    position: absolute;
    left: 11px;
    top: 1rem;
    bottom: 1rem;
    width: 2px;
    background: rgba(213, 193, 202, 0.3);
}

.rs-locator-timeline-items[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.rs-locator-timeline-item[b-0ukp8ztb6w] {
    position: relative;
}

.rs-locator-timeline-dot[b-0ukp8ztb6w] {
    position: absolute;
    left: -2rem;
    top: 6px;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    border: 4px solid #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    z-index: 1;
}

.rs-locator-timeline-dot.primary[b-0ukp8ztb6w] { background: var(--rs-primary); }
.rs-locator-timeline-dot.muted[b-0ukp8ztb6w] { background: var(--rs-surface-container); }
.rs-locator-timeline-dot.outline[b-0ukp8ztb6w] { background: var(--rs-outline-variant); }

.rs-locator-timeline-content[b-0ukp8ztb6w] {
    padding: 1rem;
    border: 1px solid var(--rs-outline-variant);
    border-radius: 0.25rem;
    transition: border-color 0.15s;
}

.rs-locator-timeline-content:hover[b-0ukp8ztb6w] {
    border-color: var(--rs-primary);
}

.rs-locator-timeline-content.highlight[b-0ukp8ztb6w] {
    background: rgba(249, 249, 251, 0.5);
}

.rs-locator-trip-title[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

.rs-locator-trip-title strong[b-0ukp8ztb6w] {
    font-size: 0.875rem;
}

.rs-locator-trip-badge[b-0ukp8ztb6w] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.125rem 0.5rem;
    border-radius: 0.125rem;
}

.rs-locator-trip-badge.arrival[b-0ukp8ztb6w] { background: #dcfce7; color: #15803d; }
.rs-locator-trip-badge.transit[b-0ukp8ztb6w] { background: var(--rs-surface-container-high); color: var(--rs-on-surface-variant); }
.rs-locator-trip-badge.origin[b-0ukp8ztb6w] { background: var(--rs-primary-container); color: var(--rs-on-primary-container); }

.rs-locator-trip-address[b-0ukp8ztb6w] {
    font-size: 0.875rem;
    color: var(--rs-on-surface-variant);
    margin: 0 0 0.75rem;
}

.rs-locator-trip-meta[b-0ukp8ztb6w] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.8125rem;
    color: var(--rs-on-surface-variant);
}

.rs-locator-trip-meta span[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.rs-locator-trip-meta .material-icons-round[b-0ukp8ztb6w] {
    font-size: 16px;
}

.rs-locator-footer[b-0ukp8ztb6w] {
    padding: 1rem 2rem;
    border-top: 1px solid var(--rs-outline-variant);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    background: #fff;
}

.rs-locator-footer-actions[b-0ukp8ztb6w] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.rs-locator-footer-btn[b-0ukp8ztb6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: transparent;
    border: none;
    color: var(--rs-primary);
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    transition: background 0.15s;
}

.rs-locator-footer-btn:hover[b-0ukp8ztb6w] {
    background: rgba(93, 26, 75, 0.08);
}

.rs-locator-footer-btn:disabled[b-0ukp8ztb6w] {
    opacity: 0.5;
    cursor: not-allowed;
}

.rs-locator-footer-note[b-0ukp8ztb6w] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-on-surface-variant);
    opacity: 0.6;
    font-style: italic;
}

.rs-locator-placeholder[b-0ukp8ztb6w] {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--rs-on-surface-variant);
}

.rs-locator-placeholder .material-icons-round[b-0ukp8ztb6w] {
    font-size: 48px;
    opacity: 0.3;
    margin-bottom: 1rem;
}

.rs-locator-skeleton[b-0ukp8ztb6w] {
    background: linear-gradient(90deg, #eceff3 25%, #dde3ea 37%, #eceff3 63%);
    background-size: 400% 100%;
    animation: rs-locator-shimmer-b-0ukp8ztb6w 1.2s ease-in-out infinite;
    border-radius: 0.25rem;
    height: 1rem;
}

.rs-locator-skeleton-lg[b-0ukp8ztb6w] { height: 3rem; margin-bottom: 0.5rem; }

@keyframes rs-locator-shimmer-b-0ukp8ztb6w {
    0% { background-position: 100% 0; }
    100% { background-position: 0 0; }
}

.rs-locator-location-stack[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.rs-locator-location-primary[b-0ukp8ztb6w] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rs-primary);
    margin: 0;
    line-height: 1.35;
}

.rs-locator-location-line[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.rs-locator-location-line small[b-0ukp8ztb6w] {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--rs-on-surface-variant);
}

.rs-locator-location-line span[b-0ukp8ztb6w] {
    font-size: 0.8125rem;
    color: var(--rs-on-surface);
    line-height: 1.4;
}

.rs-locator-trip-locations[b-0ukp8ztb6w] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
}

.rs-locator-trip-locations .rs-locator-location-line span[b-0ukp8ztb6w] {
    font-size: 0.8125rem;
    color: var(--rs-on-surface-variant);
}

.rs-locator-error[b-0ukp8ztb6w] {
    padding: 1rem;
    background: var(--rs-error-container);
    color: var(--rs-error);
    border-radius: 0.25rem;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

.rs-locator-candidates[b-0ukp8ztb6w] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.rs-locator-candidate[b-0ukp8ztb6w] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: 'IBM Plex Mono', 'Consolas', monospace;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rs-primary, #631656);
    background: #fff;
    border: 1px solid var(--rs-outline-variant, #d5c1ca);
    border-radius: 999px;
    padding: 0.35rem 0.8rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.12s;
}

.rs-locator-candidate:hover[b-0ukp8ztb6w] {
    background: var(--rs-primary, #631656);
    color: #fff;
    border-color: var(--rs-primary, #631656);
    transform: translateY(-1px);
}

.rs-locator-candidate .material-icons-round[b-0ukp8ztb6w] { font-size: 1rem; }

/* /Shared/Components/LanzaderaFilter.razor.rz.scp.css */
.lf-root[b-aqdsjudl27] {
    width: 100%;
}

/* ── Barra compacta (estado plegado) ── */
.lf-bar[b-aqdsjudl27] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    padding: 0.5rem 0.6rem;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.15s, background 0.15s;
}

.lf-bar:hover[b-aqdsjudl27] { background: rgba(0, 0, 0, 0.035); }
.lf-bar:focus-visible[b-aqdsjudl27] { outline: 2px solid var(--rs-primary, #631656); outline-offset: 1px; }

.lf-bar.active[b-aqdsjudl27] { background: var(--rs-primary-subtle, #f5eaf3); }

.lf-root.is-open .lf-bar[b-aqdsjudl27] {
    background: #fff;
    border-color: rgba(0, 0, 0, 0.09);
    border-bottom-color: transparent;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.lf-bar-ico[b-aqdsjudl27] { font-size: 1.15rem; color: var(--rs-primary, #631656); }
.lf-bar-title[b-aqdsjudl27] { font-size: 0.85rem; font-weight: 600; color: #374151; }
.lf-bar-hint[b-aqdsjudl27] { margin-left: auto; font-size: 0.8rem; color: #9ca3af; }

.lf-chip[b-aqdsjudl27] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rs-primary, #631656);
    background: #fff;
    border: 1px solid rgba(99, 22, 86, 0.2);
    padding: 0.16rem 0.6rem;
    border-radius: 999px;
    white-space: nowrap;
}

.lf-chip.warn[b-aqdsjudl27] { color: #92560a; background: var(--rs-warning-subtle, #fef3c7); border-color: #f6d27a; }
.lf-chip .material-icons-round[b-aqdsjudl27] { font-size: 0.9rem; }

.lf-dot[b-aqdsjudl27] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.lf-clear[b-aqdsjudl27] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--rs-primary, #631656);
    cursor: pointer;
    transition: background 0.15s;
}

.lf-clear:hover[b-aqdsjudl27] { background: var(--rs-primary-lighter, rgba(99, 22, 86, 0.12)); }
.lf-clear .material-icons-round[b-aqdsjudl27] { font-size: 1rem; }

.lf-bar-chev[b-aqdsjudl27] { color: #9ca3af; font-size: 1.25rem; }

/* ── Panel desplegable ── */
.lf-panel[b-aqdsjudl27] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.75rem 0.8rem 0.85rem;
    border: 1px solid rgba(0, 0, 0, 0.09);
    border-top: none;
    border-radius: 0 0 6px 6px;
    background: #fff;
}

.lf-field[b-aqdsjudl27] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.lf-label[b-aqdsjudl27] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--rs-primary, #631656);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.lf-label .material-icons-round[b-aqdsjudl27] { font-size: 0.95rem; }

.lf-week[b-aqdsjudl27] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.lf-week-label[b-aqdsjudl27] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #1f2937;
    min-width: 180px;
    text-align: center;
}

.lf-warn[b-aqdsjudl27] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: #92560a;
    background: #fffbeb;
    border: 1px solid #fde68a;
    padding: 0.4rem 0.7rem;
    border-radius: 999px;
    align-self: center;
}

.lf-warn .material-icons-round[b-aqdsjudl27] { font-size: 1rem; color: #d97706; }

.lf-warn-link[b-aqdsjudl27] {
    font-weight: 700;
    color: var(--rs-primary, #631656);
    text-decoration: underline;
}

.lf-summary[b-aqdsjudl27] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #1d4ed8;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    padding: 0.4rem 0.7rem;
    border-radius: 999px;
    align-self: center;
}

.lf-summary .material-icons-round[b-aqdsjudl27] { font-size: 1rem; }

.lf-summary-warn[b-aqdsjudl27] { color: #92560a; font-weight: 500; }
/* /Shared/Components/LanzaderaHealthCard.razor.rz.scp.css */
.lhc[b-f55278h8dm] {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 1rem 1.1rem;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #cbd5e1;
    background: #fff;
    cursor: pointer;
    transition: transform 0.18s, box-shadow 0.18s, border-color 0.18s;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

.lhc:hover[b-f55278h8dm] {
    transform: translateY(-3px);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.12);
}

.lhc-alert-state[b-f55278h8dm] { border-left-color: #ef4444; }
.lhc-confirmed-state[b-f55278h8dm] { border-left-color: #16a34a; }
.lhc-draft-state[b-f55278h8dm] { border-left-color: #2563eb; }
.lhc-none-state[b-f55278h8dm] { border-left-color: #cbd5e1; }

.lhc-top[b-f55278h8dm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.6rem;
}

.lhc-name-block[b-f55278h8dm] { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }

.lhc-name[b-f55278h8dm] { font-weight: 800; font-size: 1rem; color: #111827; line-height: 1.2; }

.lhc-company[b-f55278h8dm] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.73rem;
    color: #6b7280;
}

.lhc-company .material-icons-round[b-f55278h8dm] { font-size: 0.88rem; }

.lhc-chip[b-f55278h8dm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.26rem 0.55rem;
    border-radius: 999px;
    white-space: nowrap;
    flex: 0 0 auto;
}

.lhc-chip .material-icons-round[b-f55278h8dm] { font-size: 0.82rem; }

.chip-confirmed[b-f55278h8dm] { background: #dcfce7; color: #15803d; }
.chip-draft[b-f55278h8dm] { background: #dbeafe; color: #1d4ed8; }
.chip-none[b-f55278h8dm] { background: #f1f5f9; color: #64748b; }

/* Ruta */
.lhc-route[b-f55278h8dm] { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }

.lhc-dot[b-f55278h8dm] { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.dot-origin[b-f55278h8dm] { background: #16a34a; box-shadow: 0 0 0 3px #dcfce7; }
.dot-end[b-f55278h8dm] { background: #2563eb; box-shadow: 0 0 0 3px #dbeafe; }

.lhc-route-name[b-f55278h8dm] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lhc-route-line[b-f55278h8dm] {
    flex: 1;
    height: 3px;
    min-width: 18px;
    background: repeating-linear-gradient(90deg, #cbd5e1 0, #cbd5e1 6px, transparent 6px, transparent 11px);
    border-radius: 2px;
}

/* Mini tren */
.lhc-train[b-f55278h8dm] {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 0.55rem 0.7rem;
    border-radius: 10px;
    background: linear-gradient(180deg, #0b1626, #16283f);
    border: 1px solid #1e293b;
    overflow: hidden;
    position: relative;
}

.lhc-train[b-f55278h8dm]::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 7px;
    height: 2px;
    background: #3d5273;
}

.lhc-loco[b-f55278h8dm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px; height: 20px;
    border-radius: 5px 3px 3px 3px;
    background: linear-gradient(160deg, #8b3d7c, #631656);
    color: #fff;
    z-index: 1;
    flex: 0 0 auto;
}

.lhc-loco .material-icons-round[b-f55278h8dm] { font-size: 0.85rem; }

.lhc-wagon[b-f55278h8dm] {
    width: 18px; height: 14px;
    border-radius: 3px;
    background: linear-gradient(180deg, #2a6fd4, #16407e);
    border: 1px solid rgba(255, 255, 255, 0.18);
    z-index: 1;
    flex: 0 0 auto;
}

.lhc-wagon.wagon-issue[b-f55278h8dm] {
    background: linear-gradient(180deg, #ef4444, #b91c1c);
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.7);
}

.lhc-wagon.wagon-stop[b-f55278h8dm] {
    background: linear-gradient(180deg, #f59e0b, #b45309);
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.6);
}

.lhc-more[b-f55278h8dm] {
    font-size: 0.66rem;
    font-weight: 700;
    color: #94a3b8;
    z-index: 1;
    padding-left: 2px;
    font-family: 'IBM Plex Mono', monospace;
}

.lhc-empty[b-f55278h8dm] { font-size: 0.74rem; color: #64748b; z-index: 1; font-style: italic; }

.lhc-count[b-f55278h8dm] {
    margin-left: auto;
    z-index: 1;
    background: rgba(96, 165, 250, 0.15);
    border: 1px solid rgba(96, 165, 250, 0.35);
    color: #93c5fd;
    font-weight: 800;
    font-size: 0.72rem;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    font-family: 'IBM Plex Mono', monospace;
    flex: 0 0 auto;
}

/* Footer */
.lhc-footer[b-f55278h8dm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding-top: 0.55rem;
    border-top: 1px solid #f1f5f9;
    cursor: default;
}

.lhc-alerts[b-f55278h8dm] { display: flex; gap: 0.35rem; flex-wrap: wrap; }

.lhc-alert[b-f55278h8dm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.74rem;
    font-weight: 700;
    padding: 0.22rem 0.5rem;
    border-radius: 999px;
    text-decoration: none;
}

.lhc-alert .material-icons-round[b-f55278h8dm] { font-size: 0.85rem; }

.alert-issue[b-f55278h8dm] { background: #fef2f2; color: #dc2626; }
.alert-issue:hover[b-f55278h8dm] { background: #fee2e2; }
.alert-stop[b-f55278h8dm] { background: #fffbeb; color: #d97706; }
.alert-stop:hover[b-f55278h8dm] { background: #fef3c7; }
.alert-ok[b-f55278h8dm] { background: #f0fdf4; color: #16a34a; }

/* ===== Color dot ===== */
.lhc-color-dot[b-f55278h8dm] {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: inline-block;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

/* ===== Rotaciones badges ===== */
.lhc-rotaciones[b-f55278h8dm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    padding: 0.1rem 0;
}

.lhc-rot-badge[b-f55278h8dm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.5rem;
    border-radius: 8px;
    background: color-mix(in srgb, var(--lhc-color, #631656) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--lhc-color, #631656) 25%, transparent);
    font-size: 0.7rem;
    color: #374151;
    transition: background 0.12s;
}

.lhc-rot-badge:hover[b-f55278h8dm] {
    background: color-mix(in srgb, var(--lhc-color, #631656) 20%, transparent);
}

.lhc-rot-badge strong[b-f55278h8dm] {
    color: var(--lhc-color, #631656);
    font-size: 0.68rem;
}

.lhc-rot-route[b-f55278h8dm] {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}

.lhc-rot-empty[b-f55278h8dm] {
    font-size: 0.78rem;
    color: #94a3b8;
    font-style: italic;
}
/* /Shared/MainLayout.razor.rz.scp.css */
/* Header */
[b-tebl8qjjnc] .rz-header {
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    z-index: 100;
}

/* Sidebar - Tema Claro */
[b-tebl8qjjnc] .rz-sidebar .rz-panel-menu {
    background: transparent !important;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-wrapper {
    background: transparent !important;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item {
    margin: 1px 0.5rem;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-link {
    color: #475569 !important;
    border-radius: 6px;
    padding: 0.6rem 0.75rem;
    font-size: 0.875rem;
    transition: all 0.15s ease;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-link:hover {
    background: #f1f5f9 !important;
    color: #1e293b !important;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-link.active,
[b-tebl8qjjnc] .rz-sidebar .rz-state-active > .rz-navigation-item-link {
    background: var(--rs-primary-subtle, #f5eaf3) !important;
    color: var(--rs-primary, #631656) !important;
    font-weight: 500;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-icon {
    color: #94a3b8 !important;
    margin-right: 0.6rem;
    font-size: 1.2rem;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-link:hover .rz-navigation-item-icon {
    color: #64748b !important;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-link.active .rz-navigation-item-icon,
[b-tebl8qjjnc] .rz-sidebar .rz-state-active > .rz-navigation-item-link .rz-navigation-item-icon {
    color: var(--rs-primary, #631656) !important;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-text {
    font-size: 0.875rem;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item-icon-children {
    color: #94a3b8 !important;
}

/* Subitems */
[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item .rz-navigation-item .rz-navigation-item-link {
    padding-left: 2.25rem;
    font-size: 0.8125rem;
}

[b-tebl8qjjnc] .rz-sidebar .rz-navigation-item .rz-navigation-item .rz-navigation-item-icon {
    font-size: 1rem;
}