@import '_content/BlazorColorPicker/BlazorColorPicker.d6615pwxbx.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';
@import '_content/WMBlazorOverlayScrollbars/WMBlazorOverlayScrollbars.bundle.scp.css';

/* /Components/Layout/MainHeader.razor.rz.scp.css */
/* --- LOGO HEADER HORIZONTAL --- */
.header-element .horizontal-logo .header-logo[b-en0mhe7o8e] {
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-right: 1rem;
}

.header-element .horizontal-logo .header-logo .desktop-logo[b-en0mhe7o8e],
.header-element .horizontal-logo .header-logo .desktop-dark[b-en0mhe7o8e] {
    width: auto;
    height: 44px;
    max-width: 160px;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

@media screen and (max-width: 1024px) {
    .header-element .horizontal-logo .header-logo .desktop-logo[b-en0mhe7o8e],
    .header-element .horizontal-logo .header-logo .desktop-dark[b-en0mhe7o8e] {
        height: 40px;
        max-width: 140px;
    }
}

@media screen and (max-width: 767px) {
    .header-element .horizontal-logo .header-logo .desktop-logo[b-en0mhe7o8e],
    .header-element .horizontal-logo .header-logo .desktop-dark[b-en0mhe7o8e] {
        height: 34px;
        max-width: 120px;
    }
}

/* --- PROFILE DROPDOWN --- */
.profile-dropdown-card[b-en0mhe7o8e] {
    width: 280px;
    border: 1px solid rgba(124, 58, 237, 0.12);
    border-radius: 16px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
}

.profile-dropdown-header[b-en0mhe7o8e] {
    padding: 1rem 1.1rem;
    color: #fff;
    background: linear-gradient(135deg, #7c3aed, #a855f7);
}

.profile-settings-link[b-en0mhe7o8e] {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}

.profile-settings-link:hover[b-en0mhe7o8e] {
    color: #fff;
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-1px);
}

.profile-user-summary[b-en0mhe7o8e] {
    padding: 1rem 1.1rem;
    background: #fff;
}

.profile-avatar[b-en0mhe7o8e] {
    width: 42px;
    height: 42px;
    border: 3px solid rgba(124, 58, 237, 0.14);
}

.profile-user-copy[b-en0mhe7o8e] {
    min-width: 0;
    max-width: 190px;
}

.profile-dropdown-item[b-en0mhe7o8e] {
    min-height: 44px;
    padding: 0.75rem 1.1rem;
    font-weight: 500;
    white-space: normal;
    gap: 0.25rem;
    transition: background 0.15s ease, color 0.15s ease;
}

.profile-dropdown-item:hover[b-en0mhe7o8e] {
    color: #7c3aed;
    background: rgba(124, 58, 237, 0.08);
}

.profile-dropdown-item.text-danger:hover[b-en0mhe7o8e] {
    color: #dc2626 !important;
    background: rgba(220, 38, 38, 0.08);
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* /Components/Layout/NavMenu.razor.rz.scp.css */

/* --- LOGO SIDEBAR --- */
.main-sidebar-header[b-dijz7ux5tx] {
    min-height: 5.5rem;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.main-sidebar-header .header-logo[b-dijz7ux5tx] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.main-sidebar-header .header-logo .desktop-logo[b-dijz7ux5tx],
.main-sidebar-header .header-logo .desktop-dark[b-dijz7ux5tx] {
    width: min(170px, 100%);
    height: 52px;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

.main-sidebar-header .header-logo .toggle-logo[b-dijz7ux5tx],
.main-sidebar-header .header-logo .toggle-dark[b-dijz7ux5tx] {
    width: auto;
    height: 34px;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* --- PUNTO DE VENTA: ITEM FIJO (no scrollea con el sidebar) --- */
.pos-pin[b-dijz7ux5tx] {
    flex-shrink: 0;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    position: relative;
    z-index: 2;
}

/* En desktop, .main-sidebar-header (el logo) es position:fixed (ver
   wwwroot/assets/css/styles.css) — sale del flujo normal, así que sin este
   margen .pos-pin arranca en y=0 y el header (opaco, z-index:9) lo tapa
   por completo. En mobile el header se oculta via display:none, por eso
   ahí .pos-pin ya se veía bien sin este ajuste. */
@media (min-width: 992px) {
    .pos-pin[b-dijz7ux5tx] {
        margin-top: 5.5rem;
    }
}

.pos-pin .main-menu[b-dijz7ux5tx] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pos-pin .slide .side-menu__item[b-dijz7ux5tx] {
    border-radius: 0.375rem;
    margin: 0 0.5rem;
    padding: 0.625rem 0.75rem;
}

.pos-pin .slide.active .side-menu__item[b-dijz7ux5tx],
.pos-pin .slide .side-menu__item.active[b-dijz7ux5tx] {
    background-color: var(--primary-color, rgba(94, 53, 177, 0.08));
    color: var(--primary-color, #5e35b1);
    font-weight: 600;
}

/* Background solido cuando el sidebar está colapsado (icon-only) para
   que el SVG no se vea "flotando" sobre el contenido que scrollea debajo. */
.pos-pin[b-dijz7ux5tx]::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--sidebar-bg, #fff);
    z-index: -1;
}

/* ============================================
   RESPONSIVE: AJUSTE PARA TABLETS Y MÓVILES
   ============================================ */

/* Tablets (768px - 1024px) */
@media screen and (max-width: 1024px) {

    .main-sidebar-header .header-logo .desktop-logo[b-dijz7ux5tx],
    .main-sidebar-header .header-logo .desktop-dark[b-dijz7ux5tx] {
        width: min(150px, 100%);
        height: 46px;
    }
}

/* Móviles (hasta 767px) */
@media screen and (max-width: 767px) {

    .main-sidebar-header .header-logo .desktop-logo[b-dijz7ux5tx],
    .main-sidebar-header .header-logo .desktop-dark[b-dijz7ux5tx] {
        width: min(130px, 100%);
        height: 40px;
    }

    .main-sidebar-header .header-logo .toggle-logo[b-dijz7ux5tx],
    .main-sidebar-header .header-logo .toggle-dark[b-dijz7ux5tx] {
        height: 32px;
    }
}


/* /Components/Pages/Dashboards/Clientes/CrearCliente.razor.rz.scp.css */
body[b-fgonhsvff4] {
}
/* /Components/Pages/Dashboards/Clientes/EditarCliente.razor.rz.scp.css */
.badge-id-pill[b-eey0z4mzyy] {
    border-radius: 9999px;
    padding: .18rem .6rem;
    font-weight: 600;
    font-size: .75rem;
    letter-spacing: .02em;
    background: #f1f5f9;
    color: #0f172a;
    border: 1px solid #e2e8f0;
}

[data-theme-mode="dark"] .badge-id-pill[b-eey0z4mzyy] {
    background: #020617;
    color: #f9fafb;
    border-color: #1f2937;
}
/* /Components/Pages/Dashboards/Clientes/Index.razor.rz.scp.css */
/* ===== Ajustes modo oscuro (mejor contraste) ===== */
html[data-theme-mode="dark"] .clientes-dashboard[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard[b-z4v3e3kdyt],
.dark .clientes-dashboard[b-z4v3e3kdyt] {
    /* Números y colores vivos para iconos */
    --cd-number: #ffffff;
    --cd-icon-primary: #60a5ff; /* azul brillante */
    --cd-icon-warning: #ffd369; /* ámbar brillante */
    --cd-icon-success: #4ade80; /* verde brillante */
    --cd-success: #22c55e;
    --cd-danger: #f87171;
}

/* (A) Si puedes: marca el número con .kpi-value */
.clientes-dashboard .kpi-value[b-z4v3e3kdyt] {
    color: var(--cd-text); /* claro */
    font-size: 1.875rem; /* ~ fs-3 */
    font-weight: 600;
}

html[data-theme-mode="dark"] .clientes-dashboard .kpi-value[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .kpi-value[b-z4v3e3kdyt],
.dark .clientes-dashboard .kpi-value[b-z4v3e3kdyt] {
    color: var(--cd-number); /* blanco puro en oscuro */
}

/* (B) Si NO puedes tocar el HTML: fuerza el color del número grande dentro de la card */
html[data-theme-mode="dark"] .clientes-dashboard .card .fs-3.fw-semibold[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .card .fs-3.fw-semibold[b-z4v3e3kdyt],
.dark .clientes-dashboard .card .fs-3.fw-semibold[b-z4v3e3kdyt] {
    color: var(--cd-number) !important;
}

/* Éxitos/errores más visibles en oscuro */
html[data-theme-mode="dark"] .clientes-dashboard .text-success[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .text-success[b-z4v3e3kdyt],
.dark .clientes-dashboard .text-success[b-z4v3e3kdyt] {
    color: var(--cd-success) !important;
}

html[data-theme-mode="dark"] .clientes-dashboard .text-danger[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .text-danger[b-z4v3e3kdyt],
.dark .clientes-dashboard .text-danger[b-z4v3e3kdyt] {
    color: var(--cd-danger) !important;
}

/* Iconos de accesos rápidos más brillantes en oscuro */
html[data-theme-mode="dark"] .clientes-dashboard .bg-primary-subtle i[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .bg-primary-subtle i[b-z4v3e3kdyt],
.dark .clientes-dashboard .bg-primary-subtle i[b-z4v3e3kdyt] {
    color: var(--cd-icon-primary) !important;
}

html[data-theme-mode="dark"] .clientes-dashboard .bg-warning-subtle i[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .bg-warning-subtle i[b-z4v3e3kdyt],
.dark .clientes-dashboard .bg-warning-subtle i[b-z4v3e3kdyt] {
    color: var(--cd-icon-warning) !important;
}

html[data-theme-mode="dark"] .clientes-dashboard .bg-success-subtle i[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .bg-success-subtle i[b-z4v3e3kdyt],
.dark .clientes-dashboard .bg-success-subtle i[b-z4v3e3kdyt] {
    color: var(--cd-icon-success) !important;
}

/* Extra: mejora el contraste de encabezados de tablas en oscuro */
html[data-theme-mode="dark"] .clientes-dashboard .table thead th[b-z4v3e3kdyt] {
    color: #cbd5e1 !important; /* un gris claro legible */
}

/* Quick access cards — efecto botón con más sombra */
.clientes-dashboard .hover-shadow[b-z4v3e3kdyt] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    cursor: pointer;
}

.clientes-dashboard .hover-shadow:hover[b-z4v3e3kdyt] {
    transform: translateY(-3px);
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.2) !important;
}

html[data-theme-mode="dark"] .clientes-dashboard .hover-shadow:hover[b-z4v3e3kdyt],
body[data-theme-mode="dark"] .clientes-dashboard .hover-shadow:hover[b-z4v3e3kdyt],
.dark .clientes-dashboard .hover-shadow:hover[b-z4v3e3kdyt] {
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.4) !important;
}
/* /Components/Pages/Dashboards/Clientes/ListarCliente.razor.rz.scp.css */
.table td.text-end[b-r6edd68xu0] {
    white-space: nowrap;
}

    .table td.text-end .btn[b-r6edd68xu0] {
        vertical-align: middle;
    }

/* Identificación (code) en tabla: mejor contraste en oscuro */
[data-theme-mode="dark"] .table code[b-r6edd68xu0] {
    color: #f5f7fb !important;
    background: transparent !important;
    padding: 0;
}

/* ===== Dark mode: badges legibles ===== */
/* Tipo (usa bg-*-subtle text-*) */
[data-theme-mode="dark"] .badge.bg-primary-subtle[b-r6edd68xu0] {
    background: rgba(13,110,253,.18) !important;
    color: #dbe8ff !important;
    border: 1px solid rgba(13,110,253,.35);
}

[data-theme-mode="dark"] .badge.bg-success-subtle[b-r6edd68xu0] {
    background: rgba(25,135,84,.20) !important;
    color: #d9ffe9 !important;
    border: 1px solid rgba(25,135,84,.35);
}

[data-theme-mode="dark"] .badge.bg-info-subtle[b-r6edd68xu0] {
    background: rgba(13,202,240,.18) !important;
    color: #d9f7ff !important;
    border: 1px solid rgba(13,202,240,.35);
}

[data-theme-mode="dark"] .badge.bg-danger-subtle[b-r6edd68xu0] {
    background: rgba(220,53,69,.20) !important;
    color: #ffd9de !important;
    border: 1px solid rgba(220,53,69,.40);
}

[data-theme-mode="dark"] .badge.bg-secondary-subtle[b-r6edd68xu0] {
    background: rgba(108,117,125,.22) !important;
    color: #f0f2f4 !important;
    border: 1px solid rgba(108,117,125,.40);
}

/* Estado: Activo/Inactivo (ya usas bg-success-subtle / bg-danger-subtle) */
/* Las reglas anteriores ya los cubren */

/* ===== Dark mode: botones outline (acciones) ===== */
[data-theme-mode="dark"] .btn-outline-primary[b-r6edd68xu0] {
    color: #9ec1ff;
    border-color: #3b82f6;
}

    [data-theme-mode="dark"] .btn-outline-primary:hover[b-r6edd68xu0],
    [data-theme-mode="dark"] .btn-outline-primary:focus[b-r6edd68xu0] {
        background: rgba(59,130,246,.15);
        color: #cfe1ff;
        border-color: #60a5fa;
    }

[data-theme-mode="dark"] .btn-outline-info[b-r6edd68xu0] {
    color: #7fe3ff;
    border-color: #22d3ee;
}

    [data-theme-mode="dark"] .btn-outline-info:hover[b-r6edd68xu0],
    [data-theme-mode="dark"] .btn-outline-info:focus[b-r6edd68xu0] {
        background: rgba(34,211,238,.15);
        color: #c8f7ff;
        border-color: #67e8f9;
    }

[data-theme-mode="dark"] .btn-outline-danger[b-r6edd68xu0] {
    color: #ff9fb0;
    border-color: #ef4444;
}

    [data-theme-mode="dark"] .btn-outline-danger:hover[b-r6edd68xu0],
    [data-theme-mode="dark"] .btn-outline-danger:focus[b-r6edd68xu0] {
        background: rgba(239,68,68,.16);
        color: #ffd7dd;
        border-color: #f87171;
    }

/* Alineación consistente de iconos en celda acciones */
.table td.text-end .btn[b-r6edd68xu0] {
    vertical-align: middle;
}

/* ===== SweetAlert2 toast: apariencia en oscuro (igual a paneles) ===== */
[data-theme-mode="dark"] .swal2-toast.swal2-toast-app[b-r6edd68xu0] {
    background: #121720 !important; /* tono del resto de alertas/paneles */
    color: #e7ebf2 !important;
    box-shadow: 0 8px 28px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

    [data-theme-mode="dark"] .swal2-toast.swal2-toast-app .swal2-title[b-r6edd68xu0] {
        color: inherit !important;
    }

    [data-theme-mode="dark"] .swal2-toast.swal2-toast-app .swal2-timer-progress-bar[b-r6edd68xu0] {
        background: rgba(255,255,255,.25) !important;
    }

/* ===== Ajustes menores de tabla en oscuro ===== */
[data-theme-mode="dark"] .table thead[b-r6edd68xu0],
[data-theme-mode="dark"] .table th[b-r6edd68xu0] {
    color: #c9ced6 !important;
}

[data-theme-mode="dark"] .table td small[b-r6edd68xu0] {
    color: #cfd6df;
}
/* /Components/Pages/Dashboards/Facturas/CrearFactura.razor.rz.scp.css */
/* ==========================
   AJUSTES VISUALES: TABLAS, CHECKBOX Y BADGES
   ========================== */

/* 1. TH de la Tabla: Contraste fuerte y moderno */
.table thead th[b-mnbdoqe0ty] {
    color: #000000 !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-size: 0.85rem;
}

html[data-theme-mode="dark"] .table thead th[b-mnbdoqe0ty],
body[data-theme-mode="dark"] .table thead th[b-mnbdoqe0ty],
.dark .table thead th[b-mnbdoqe0ty] {
    color: #ffffff !important;
    background-color: #1e1e2d;
    border-bottom-color: #2b2b40;
}

/* 2. Checkboxes Morados con Animación "Pop" */
.form-check-input[b-mnbdoqe0ty] {
    width: 1.3em;
    height: 1.3em;
    border: 2px solid #a5b4fc;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .form-check-input:checked[b-mnbdoqe0ty] {
        background-color: #6366f1;
        border-color: #6366f1;
        box-shadow: 0 0 10px rgba(99, 102, 241, 0.4);
        transform: scale(1.1);
    }

[data-theme-mode="dark"] .form-check-input[b-mnbdoqe0ty] {
    background-color: rgba(255,255,255,0.05);
    border-color: #6366f1;
}

    [data-theme-mode="dark"] .form-check-input:checked[b-mnbdoqe0ty] {
        background-color: #6366f1;
    }

/* 3. Badges con micro-interacción */
.badge[b-mnbdoqe0ty] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .badge:hover[b-mnbdoqe0ty] {
        transform: translateY(-1px);
    }

    .badge.bg-secondary-subtle.text-dark[b-mnbdoqe0ty] {
        background-color: #e2e8f0 !important;
        color: #0f172a !important;
        border: 1px solid #cbd5e1;
        font-weight: 600;
    }

    .badge.bg-info-subtle.text-info[b-mnbdoqe0ty] {
        background-color: #e0f2fe !important;
        color: #0284c7 !important;
        border: 1px solid #7dd3fc;
        font-weight: 600;
    }

[data-theme-mode="dark"] .badge.bg-secondary-subtle.text-dark[b-mnbdoqe0ty] {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.3);
}

[data-theme-mode="dark"] .badge.bg-info-subtle.text-info[b-mnbdoqe0ty] {
    background-color: rgba(14, 165, 233, 0.25) !important;
    color: #38bdf8 !important;
    border-color: rgba(14, 165, 233, 0.5);
}

/* ==========================
   ESTILOS GENERALES (BASE)
   ========================== */

/* Colores Modo Oscuro */
html[data-theme-mode="dark"] .productos-dashboard[b-mnbdoqe0ty],
body[data-theme-mode="dark"] .productos-dashboard[b-mnbdoqe0ty],
.dark .productos-dashboard[b-mnbdoqe0ty] {
    --pd-number: #ffffff;
    --pd-icon-primary: #60a5ff;
    --pd-icon-warning: #ffd369;
    --pd-icon-success: #4ade80;
    --pd-success: #22c55e;
    --pd-danger: #f87171;
}

[data-theme-mode="dark"] .card.custom-card .fs-3.fw-semibold[b-mnbdoqe0ty],
[data-theme-mode="dark"] .text-success[b-mnbdoqe0ty],
[data-theme-mode="dark"] .text-danger[b-mnbdoqe0ty] {
    color: inherit !important;
}

/* CARDS ANIMADAS */
.card.custom-card[b-mnbdoqe0ty] {
    border: none;
    border-radius: 0.75rem;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
    z-index: 1;
    /* ANIMACIÓN DE ENTRADA (Slide Up) */
    animation: slideInUpCard-b-mnbdoqe0ty 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) backwards;
}

/* Retrasos escalonados para efecto cascada en los formularios */
.col-xl-8 .card.custom-card:nth-of-type(1)[b-mnbdoqe0ty] {
    animation-delay: 0.1s;
}

.col-xl-8 .card.custom-card:nth-of-type(2)[b-mnbdoqe0ty] {
    animation-delay: 0.2s;
}

.col-xl-4 .card.custom-card:nth-of-type(1)[b-mnbdoqe0ty] {
    animation-delay: 0.3s;
}

.card.custom-card:hover:not(.dropdown-activo)[b-mnbdoqe0ty] {
    transform: translateY(-5px);
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.12) !important;
    z-index: 5;
}

/* Inputs Animados */
.form-control[b-mnbdoqe0ty], .form-select[b-mnbdoqe0ty] {
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

    .form-control:focus[b-mnbdoqe0ty], .form-select:focus[b-mnbdoqe0ty] {
        border-color: #6366f1;
        box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.15);
        transform: translateY(-1px);
    }

/* Autocomplete Global */
.autocomplete-dropdown[b-mnbdoqe0ty],
.autocomplete-dropdown-custom[b-mnbdoqe0ty],
.autocomplete-dropdown-productos[b-mnbdoqe0ty] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    max-height: 350px;
    overflow-y: auto;
    z-index: 9999;
    margin-top: 4px;
    /* Animación menú */
    animation: menuSlideIn-b-mnbdoqe0ty 0.25s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
    transform-origin: top center;
}

@keyframes menuSlideIn-b-mnbdoqe0ty {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(0.98);
    }

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

/* Items Autocomplete */
.autocomplete-item[b-mnbdoqe0ty],
.autocomplete-item-custom[b-mnbdoqe0ty],
.autocomplete-item-producto[b-mnbdoqe0ty] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: none;
    background: white;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    text-align: left;
    display: block;
    transition: background-color 0.15s ease, padding-left 0.2s ease;
}

    .autocomplete-item:hover[b-mnbdoqe0ty],
    .autocomplete-item-custom:hover[b-mnbdoqe0ty],
    .autocomplete-item-producto:hover[b-mnbdoqe0ty] {
        background: linear-gradient(to right, #f0f9ff 0%, #e0f2fe 100%);
        border-left: 3px solid #6366f1;
        padding-left: 1.25rem;
    }

.autocomplete-avatar[b-mnbdoqe0ty] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin-right: 0.75rem;
    flex-shrink: 0;
    box-shadow: 0 4px 6px rgba(99, 102, 241, 0.3);
}

/* Modo Oscuro Autocomplete */
[data-theme-mode="dark"] .autocomplete-dropdown-custom[b-mnbdoqe0ty],
[data-theme-mode="dark"] .autocomplete-dropdown-productos[b-mnbdoqe0ty] {
    background: #1f2937;
    border-color: #374151;
}

[data-theme-mode="dark"] .autocomplete-item-custom[b-mnbdoqe0ty],
[data-theme-mode="dark"] .autocomplete-item-producto[b-mnbdoqe0ty] {
    background: #1f2937;
    border-bottom-color: #374151;
    color: #e5e7eb;
}

    [data-theme-mode="dark"] .autocomplete-item-custom:hover[b-mnbdoqe0ty],
    [data-theme-mode="dark"] .autocomplete-item-producto:hover[b-mnbdoqe0ty] {
        background: linear-gradient(to right, rgba(99, 102, 241, 0.2) 0%, rgba(99, 102, 241, 0.1) 100%);
    }

/* Tabla - Filas */
.table-hover tbody tr[b-mnbdoqe0ty] {
    transition: background-color 0.2s ease;
    transform: none !important;
}

    .table-hover tbody tr:hover[b-mnbdoqe0ty] {
        background-color: rgba(99, 102, 241, 0.05);
    }

/* Selección Modo Oscuro Modal */
[data-theme-mode="dark"] .modal-productos-table .table-primary[b-mnbdoqe0ty] {
    --bs-table-bg: rgba(99, 102, 241, 0.25) !important;
    background-color: var(--bs-table-bg) !important;
    color: white !important;
}

    [data-theme-mode="dark"] .modal-productos-table .table-primary td .text-muted[b-mnbdoqe0ty] {
        color: #e0e7ff !important;
    }

/* Botones */
.btn[b-mnbdoqe0ty] {
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

    .btn:hover[b-mnbdoqe0ty] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }

    .btn:active[b-mnbdoqe0ty] {
        transform: translateY(0);
    }

.btn-primary[b-mnbdoqe0ty] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    border: none;
}

    .btn-primary:hover[b-mnbdoqe0ty] {
        background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
        box-shadow: 0 8px 20px rgba(99, 102, 241, 0.4);
    }

.btn-success[b-mnbdoqe0ty] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    border: none;
}

    .btn-success:hover[b-mnbdoqe0ty] {
        background: linear-gradient(135deg, #059669 0%, #047857 100%);
        box-shadow: 0 8px 20px rgba(16, 185, 129, 0.4);
    }

/* =========================================================
   NUEVAS ANIMACIONES Y ESTILOS DE MODAL
   ========================================================= */

/* 1. ESTILO PREMIUM DE HEADERS DE MODAL */
.modal-header.bg-primary[b-mnbdoqe0ty] {
    /* Gradiente más rico y profundo */
    background: linear-gradient(135deg, #6366f1 0%, #4338ca 100%);
    color: #ffffff;
    /* Espaciado interno generoso */
    padding: 1.25rem 1.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    /* Sombra sutil para separar del cuerpo */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

    .modal-header.bg-primary .modal-title[b-mnbdoqe0ty] {
        font-weight: 700;
        font-size: 1.2rem;
        letter-spacing: 0.5px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #ffffff !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    }

    /* Botón cerrar personalizado dentro del header */
    .modal-header.bg-primary .btn-close-white[b-mnbdoqe0ty] {
        background-color: rgba(255, 255, 255, 0.2);
        border-radius: 50%;
        padding: 0.6rem;
        background-size: 40%;
        transition: all 0.3s ease;
        opacity: 1;
    }

        .modal-header.bg-primary .btn-close-white:hover[b-mnbdoqe0ty] {
            background-color: rgba(255, 255, 255, 0.4);
            transform: rotate(90deg) scale(1.1); /* Animación de rotación */
            box-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
        }

/* 2. Animación de Entrada para Cards (Formularios) */
@keyframes slideInUpCard-b-mnbdoqe0ty {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }

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

/* 3. Animación de Entrada para el Modal (Pop In Elástico) */
.modal.show .modal-dialog[b-mnbdoqe0ty] {
    animation: modalPopIn-b-mnbdoqe0ty 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes modalPopIn-b-mnbdoqe0ty {
    0% {
        opacity: 0;
        transform: scale(0.8) translateY(20px);
    }

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

/* Clase opcional para salida si se usa JS para alternar clases */
.modal.closing .modal-dialog[b-mnbdoqe0ty] {
    animation: modalSlideOut-b-mnbdoqe0ty 0.3s ease-in forwards;
}

@keyframes modalSlideOut-b-mnbdoqe0ty {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-20px);
    }
}

/* 4. Animación de Fila Seleccionada (Flash/Pulse) */
@keyframes rowSelectionPulse-b-mnbdoqe0ty {
    0% {
        background-color: rgba(99, 102, 241, 0.05);
        transform: scale(1);
    }

    50% {
        background-color: rgba(99, 102, 241, 0.2);
        transform: scale(1.01);
        box-shadow: 0 4px 12px rgba(99, 102, 241, 0.15);
        z-index: 10;
        position: relative;
    }

    100% {
        transform: scale(1);
        z-index: auto;
    }
}

.modal-productos-table .table-primary[b-mnbdoqe0ty] {
    animation: rowSelectionPulse-b-mnbdoqe0ty 0.4s ease-out forwards;
}

/* =========================================================
   SOLUCIÓN TÉCNICA: Z-INDEX Y OVERFLOW
   ========================================================= */

/* 1. LIBERAR LA TABLA */
.table-responsive:focus-within[b-mnbdoqe0ty] {
    overflow: visible !important;
}

/* 2. JERARQUÍA DE FILAS */
.table tbody tr[b-mnbdoqe0ty] {
    position: relative;
    z-index: 1;
}

    .table tbody tr:focus-within[b-mnbdoqe0ty] {
        position: relative;
        z-index: 100 !important;
        background-color: var(--bs-body-bg, #fff);
        box-shadow: 0 0 15px rgba(0,0,0,0.05);
    }

[data-theme-mode="dark"] .table tbody tr:focus-within[b-mnbdoqe0ty] {
    background-color: var(--bs-body-bg, #151521);
}

/* 3. JERARQUÍA DEL INPUT Y DROPDOWN */
.table .input-group[b-mnbdoqe0ty] {
    position: relative;
}

    .table .input-group:focus-within[b-mnbdoqe0ty] {
        z-index: 1050;
    }

/* 4. CARD DROPDOWN (CLIENTES) - Bloqueo de animación */
.card.custom-card.dropdown-activo[b-mnbdoqe0ty] {
    z-index: 2000 !important;
    overflow: visible !important;
    transform: none !important;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

    .card.custom-card.dropdown-activo .card-body[b-mnbdoqe0ty] {
        overflow: visible !important;
    }

/* ==========================
   COMPACT CLIENT BADGE
   ========================== */
.client-header-badge[b-mnbdoqe0ty] {
    animation: slideInUpCard-b-mnbdoqe0ty 0.4s ease backwards;
}

.client-header-badge .btn-outline-secondary[b-mnbdoqe0ty] {
    padding: 0.2rem 0.5rem;
    font-size: 0.8rem;
    border-radius: 50%;
}

/* ==========================
   COMPACT INFO ROW
   ========================== */
.compact-info-row[b-mnbdoqe0ty] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-left: 4px solid #6366f1;
}

html[data-theme-mode="dark"] .compact-info-row[b-mnbdoqe0ty] {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    border-color: #334155;
}

/* ==========================
   COLOR-CODED CART ROWS
   ========================== */
.row-iva-0[b-mnbdoqe0ty] {
    background-color: rgba(16, 185, 129, 0.05) !important;
    border-left: 3px solid #10b981;
}

.row-iva-15[b-mnbdoqe0ty] {
    background-color: rgba(245, 158, 11, 0.05) !important;
    border-left: 3px solid #f59e0b;
}

.row-stock-low[b-mnbdoqe0ty] {
    background-color: rgba(239, 68, 68, 0.05) !important;
}

.row-stock-low .badge-stock[b-mnbdoqe0ty] {
    background-color: #ef4444 !important;
    color: white !important;
}

.row-stock-medium[b-mnbdoqe0ty] {
    background-color: rgba(249, 115, 22, 0.03) !important;
}

html[data-theme-mode="dark"] .row-iva-0[b-mnbdoqe0ty] {
    background-color: rgba(16, 185, 129, 0.12) !important;
}

html[data-theme-mode="dark"] .row-iva-15[b-mnbdoqe0ty] {
    background-color: rgba(245, 158, 11, 0.12) !important;
}

html[data-theme-mode="dark"] .row-stock-low[b-mnbdoqe0ty] {
    background-color: rgba(239, 68, 68, 0.12) !important;
}

/* ==========================
   CLIENT SEARCH CARD (HIDDEN/TOGGLE)
   ========================== */
#clientSearchCard[b-mnbdoqe0ty] {
    border: 2px dashed #6366f1;
    animation: slideInUpCard-b-mnbdoqe0ty 0.3s ease backwards;
}

/* ==========================
   EMPTY CLIENT STATE
   ========================== */
.border-dashed[b-mnbdoqe0ty] {
    border-style: dashed !important;
    border-width: 2px !important;
    border-color: #cbd5e1 !important;
}

html[data-theme-mode="dark"] .border-dashed[b-mnbdoqe0ty] {
    border-color: #475569 !important;
}

/* ==========================
   BLOQUE 2 — Highlight de fila recién escaneada
   ========================== */
@keyframes rowJustScannedPulse-b-mnbdoqe0ty {
    0% {
        background-color: rgba(99, 102, 241, 0.25);
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.45);
        transform: translateY(0);
    }
    60% {
        background-color: rgba(99, 102, 241, 0.18);
        box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.3);
    }
    100% {
        background-color: transparent;
        box-shadow: none;
    }
}

.row-just-scanned[b-mnbdoqe0ty] {
    animation: rowJustScannedPulse-b-mnbdoqe0ty 1.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    position: relative;
    z-index: 2;
}

[data-theme-mode="dark"] .row-just-scanned[b-mnbdoqe0ty] {
    background-color: rgba(129, 140, 248, 0.28) !important;
}

/* ==========================
   POS CART — Layout responsive para pantallas chicas
   ========================== */

/* TH Cantidad: ancho mínimo garantizado, no se corta en lg */
.pos-th-qty[b-mnbdoqe0ty] {
    min-width: 140px;
    width: 18%;
    white-space: nowrap;
}

/* TD Cantidad: contenido alineado y sin desbordar */
.pos-td-qty[b-mnbdoqe0ty] {
    white-space: nowrap;
    vertical-align: middle;
}

/* Input-group de cantidad: nunca se corta, crece si tiene espacio */
.pos-qty-group[b-mnbdoqe0ty] {
    max-width: 100%;
    min-width: 130px;
    flex-wrap: nowrap;
}

    .pos-qty-group .form-control[b-mnbdoqe0ty] {
        min-width: 50px;
        text-align: center;
        font-weight: 600;
    }

    .pos-qty-group .btn[b-mnbdoqe0ty] {
        padding: 0.25rem 0.5rem;
        flex-shrink: 0;
    }

/* Stock badge debajo de la cantidad (desktop/tablet) */
.pos-qty-stock[b-mnbdoqe0ty] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.25rem;
    font-size: 0.75rem;
}

/* En lg (992-1199px) el cart ocupa todo el ancho y el resumen baja */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .pos-cart-section[b-mnbdoqe0ty] {
        width: 100%;
    }

    .pos-summary-section[b-mnbdoqe0ty] {
        margin-top: 1rem;
    }
}
/* /Components/Pages/Dashboards/Lotes/CrearLote.razor.rz.scp.css */
/* ==========================================
   FORMULARIO CREAR LOTE - ESTILOS
   Mejora de legibilidad en modo claro y oscuro
   ========================================== */

/* Secciones del formulario */
.lote-form-section[b-y63v7uvvut] {
    background-color: var(--form-control-bg, #fff);
    transition: all 0.2s ease;
}

/* Labels */
.lote-form-label[b-y63v7uvvut] {
    color: var(--default-text-color, #212529);
    font-weight: 500;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

/* Inputs */
.lote-form-input[b-y63v7uvvut] {
    background-color: var(--form-control-bg, #fff) !important;
    color: var(--default-text-color, #212529) !important;
    border-color: var(--default-border, #dee2e6) !important;
}

    .lote-form-input:focus[b-y63v7uvvut] {
        background-color: var(--form-control-bg, #fff) !important;
        color: var(--default-text-color, #212529) !important;
        border-color: var(--primary, #6366f1) !important;
        box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25) !important;
    }

/* Iconos en inputs */
.lote-input-icon[b-y63v7uvvut] {
    background-color: var(--form-control-bg, #fff) !important;
    border-color: var(--default-border, #dee2e6) !important;
    color: var(--text-muted, #6c757d) !important;
}

/* Textos de ayuda */
.lote-help-text[b-y63v7uvvut] {
    color: var(--text-muted, #6c757d);
    font-size: 0.813rem;
    line-height: 1.4;
}

/* ==========================================
   ALERTAS
   ========================================== */

/* Alerta Info */
.lote-alert-info[b-y63v7uvvut] {
    background-color: rgba(13, 202, 240, 0.15) !important;
}

[data-theme-mode="dark"] .lote-alert-info[b-y63v7uvvut] {
    background-color: rgba(13, 202, 240, 0.2) !important;
}

/* Alerta Warning */
.lote-alert-warning[b-y63v7uvvut] {
    background-color: rgba(255, 193, 7, 0.15) !important;
}

[data-theme-mode="dark"] .lote-alert-warning[b-y63v7uvvut] {
    background-color: rgba(255, 193, 7, 0.2) !important;
}

/* Texto de alertas */
.lote-alert-text[b-y63v7uvvut] {
    color: var(--default-text-color, #212529);
    line-height: 1.5;
}

/* ==========================================
   CAJAS DE INFORMACIÓN
   ========================================== */

.lote-info-box[b-y63v7uvvut] {
    background-color: var(--light, #f8f9fa);
    border-color: var(--default-border, #dee2e6) !important;
    transition: all 0.2s ease;
}

[data-theme-mode="dark"] .lote-info-box[b-y63v7uvvut] {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.lote-info-title[b-y63v7uvvut] {
    color: var(--default-text-color, #212529);
}

.lote-info-content[b-y63v7uvvut] {
    color: var(--text-muted, #6c757d);
}

.lote-info-border[b-y63v7uvvut] {
    border-top: 1px solid var(--default-border, #dee2e6) !important;
}

[data-theme-mode="dark"] .lote-info-border[b-y63v7uvvut] {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

/* ==========================================
   BARRA DE PROGRESO
   ========================================== */

.lote-progress[b-y63v7uvvut] {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 0.375rem;
}

[data-theme-mode="dark"] .lote-progress[b-y63v7uvvut] {
    background-color: rgba(255, 255, 255, 0.1);
}

/* ==========================================
   CAJA DE ESTADO
   ========================================== */

.lote-estado-box[b-y63v7uvvut] {
    background-color: rgba(25, 135, 84, 0.1);
    border-color: rgba(25, 135, 84, 0.2) !important;
    transition: all 0.2s ease;
}

[data-theme-mode="dark"] .lote-estado-box[b-y63v7uvvut] {
    background-color: rgba(25, 135, 84, 0.15);
    border-color: rgba(25, 135, 84, 0.3) !important;
}

.lote-estado-description[b-y63v7uvvut] {
    color: var(--text-muted, #6c757d);
    line-height: 1.5;
}

/* ==========================================
   ANÁLISIS DE RENTABILIDAD - Mejora de legibilidad
   ========================================== */

.lote-info-box .lote-info-content strong[b-y63v7uvvut] {
    color: var(--default-text-color, #212529);
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content strong[b-y63v7uvvut] {
    color: var(--default-text-color, #e6e6e6);
}

.lote-info-box .lote-info-content .text-success[b-y63v7uvvut] {
    color: #10b981 !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-success[b-y63v7uvvut] {
    color: #34d399 !important;
}

.lote-info-box .lote-info-content .text-warning[b-y63v7uvvut] {
    color: #f59e0b !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-warning[b-y63v7uvvut] {
    color: #fbbf24 !important;
}

.lote-info-box .lote-info-content .text-danger[b-y63v7uvvut] {
    color: #ef4444 !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-danger[b-y63v7uvvut] {
    color: #f87171 !important;
}

/* Iconos de rentabilidad */
.lote-info-content .ri-arrow-down-line[b-y63v7uvvut],
.lote-info-content .ri-arrow-up-line[b-y63v7uvvut],
.lote-info-content .ri-coin-line[b-y63v7uvvut] {
    font-size: 1rem;
    font-weight: bold;
}

/* Labels de resumen de stock */
.lote-info-content .ri-box-3-line[b-y63v7uvvut],
.lote-info-content .ri-shopping-cart-line[b-y63v7uvvut] {
    opacity: 0.8;
}

/* Mejorar contraste general del contenido info */
.lote-info-content[b-y63v7uvvut] {
    color: var(--default-text-color, #495057);
}

[data-theme-mode="dark"] .lote-info-content[b-y63v7uvvut] {
    color: rgba(255, 255, 255, 0.85);
}

/* ==========================================
   FOOTER
   ========================================== */

.lote-footer-border[b-y63v7uvvut] {
    border-top: 1px solid var(--default-border, #dee2e6) !important;
}

[data-theme-mode="dark"] .lote-footer-border[b-y63v7uvvut] {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

.lote-footer-text[b-y63v7uvvut] {
    color: var(--text-muted, #6c757d);
}

/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 768px) {
    .lote-form-section[b-y63v7uvvut] {
        padding: 1rem !important;
    }

    .lote-info-box[b-y63v7uvvut] {
        padding: 0.75rem !important;
    }

    .lote-form-label[b-y63v7uvvut] {
        font-size: 0.813rem;
    }

    .lote-help-text[b-y63v7uvvut] {
        font-size: 0.75rem;
    }
}
/* /Components/Pages/Dashboards/Lotes/EditarLote.razor.rz.scp.css */
/* ==========================================
   FORMULARIO CREAR LOTE - ESTILOS
   Mejora de legibilidad en modo claro y oscuro
   ========================================== */

/* Secciones del formulario */
.lote-form-section[b-mpdrff1uy7] {
    background-color: var(--form-control-bg, #fff);
    transition: all 0.2s ease;
}

/* Labels */
.lote-form-label[b-mpdrff1uy7] {
    color: var(--default-text-color, #212529);
    font-weight: 500;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

/* Inputs */
.lote-form-input[b-mpdrff1uy7] {
    background-color: var(--form-control-bg, #fff) !important;
    color: var(--default-text-color, #212529) !important;
    border-color: var(--default-border, #dee2e6) !important;
}

    .lote-form-input:focus[b-mpdrff1uy7] {
        background-color: var(--form-control-bg, #fff) !important;
        color: var(--default-text-color, #212529) !important;
        border-color: var(--primary, #6366f1) !important;
        box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25) !important;
    }

/* Iconos en inputs */
.lote-input-icon[b-mpdrff1uy7] {
    background-color: var(--form-control-bg, #fff) !important;
    border-color: var(--default-border, #dee2e6) !important;
    color: var(--text-muted, #6c757d) !important;
}

/* Textos de ayuda */
.lote-help-text[b-mpdrff1uy7] {
    color: var(--text-muted, #6c757d);
    font-size: 0.813rem;
    line-height: 1.4;
}

/* ==========================================
   ALERTAS
   ========================================== */

/* Alerta Info */
.lote-alert-info[b-mpdrff1uy7] {
    background-color: rgba(13, 202, 240, 0.15) !important;
}

[data-theme-mode="dark"] .lote-alert-info[b-mpdrff1uy7] {
    background-color: rgba(13, 202, 240, 0.2) !important;
}

/* Alerta Warning */
.lote-alert-warning[b-mpdrff1uy7] {
    background-color: rgba(255, 193, 7, 0.15) !important;
}

[data-theme-mode="dark"] .lote-alert-warning[b-mpdrff1uy7] {
    background-color: rgba(255, 193, 7, 0.2) !important;
}

/* Texto de alertas */
.lote-alert-text[b-mpdrff1uy7] {
    color: var(--default-text-color, #212529);
    line-height: 1.5;
}

/* ==========================================
   CAJAS DE INFORMACIÓN
   ========================================== */

.lote-info-box[b-mpdrff1uy7] {
    background-color: var(--light, #f8f9fa);
    border-color: var(--default-border, #dee2e6) !important;
    transition: all 0.2s ease;
}

[data-theme-mode="dark"] .lote-info-box[b-mpdrff1uy7] {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.lote-info-title[b-mpdrff1uy7] {
    color: var(--default-text-color, #212529);
}

.lote-info-content[b-mpdrff1uy7] {
    color: var(--text-muted, #6c757d);
}

.lote-info-border[b-mpdrff1uy7] {
    border-top: 1px solid var(--default-border, #dee2e6) !important;
}

[data-theme-mode="dark"] .lote-info-border[b-mpdrff1uy7] {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

/* ==========================================
   BARRA DE PROGRESO
   ========================================== */

.lote-progress[b-mpdrff1uy7] {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 0.375rem;
}

[data-theme-mode="dark"] .lote-progress[b-mpdrff1uy7] {
    background-color: rgba(255, 255, 255, 0.1);
}

/* ==========================================
   CAJA DE ESTADO
   ========================================== */

.lote-estado-box[b-mpdrff1uy7] {
    background-color: rgba(25, 135, 84, 0.1);
    border-color: rgba(25, 135, 84, 0.2) !important;
    transition: all 0.2s ease;
}

[data-theme-mode="dark"] .lote-estado-box[b-mpdrff1uy7] {
    background-color: rgba(25, 135, 84, 0.15);
    border-color: rgba(25, 135, 84, 0.3) !important;
}

.lote-estado-description[b-mpdrff1uy7] {
    color: var(--text-muted, #6c757d);
    line-height: 1.5;
}

/* ==========================================
   ANÁLISIS DE RENTABILIDAD - Mejora de legibilidad
   ========================================== */

.lote-info-box .lote-info-content strong[b-mpdrff1uy7] {
    color: var(--default-text-color, #212529);
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content strong[b-mpdrff1uy7] {
    color: var(--default-text-color, #e6e6e6);
}

.lote-info-box .lote-info-content .text-success[b-mpdrff1uy7] {
    color: #10b981 !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-success[b-mpdrff1uy7] {
    color: #34d399 !important;
}

.lote-info-box .lote-info-content .text-warning[b-mpdrff1uy7] {
    color: #f59e0b !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-warning[b-mpdrff1uy7] {
    color: #fbbf24 !important;
}

.lote-info-box .lote-info-content .text-danger[b-mpdrff1uy7] {
    color: #ef4444 !important;
    font-weight: 600;
}

[data-theme-mode="dark"] .lote-info-box .lote-info-content .text-danger[b-mpdrff1uy7] {
    color: #f87171 !important;
}

/* Iconos de rentabilidad */
.lote-info-content .ri-arrow-down-line[b-mpdrff1uy7],
.lote-info-content .ri-arrow-up-line[b-mpdrff1uy7],
.lote-info-content .ri-coin-line[b-mpdrff1uy7] {
    font-size: 1rem;
    font-weight: bold;
}

/* Labels de resumen de stock */
.lote-info-content .ri-box-3-line[b-mpdrff1uy7],
.lote-info-content .ri-shopping-cart-line[b-mpdrff1uy7] {
    opacity: 0.8;
}

/* Mejorar contraste general del contenido info */
.lote-info-content[b-mpdrff1uy7] {
    color: var(--default-text-color, #495057);
}

[data-theme-mode="dark"] .lote-info-content[b-mpdrff1uy7] {
    color: rgba(255, 255, 255, 0.85);
}

/* ==========================================
   FOOTER
   ========================================== */

.lote-footer-border[b-mpdrff1uy7] {
    border-top: 1px solid var(--default-border, #dee2e6) !important;
}

[data-theme-mode="dark"] .lote-footer-border[b-mpdrff1uy7] {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

.lote-footer-text[b-mpdrff1uy7] {
    color: var(--text-muted, #6c757d);
}

/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 768px) {
    .lote-form-section[b-mpdrff1uy7] {
        padding: 1rem !important;
    }

    .lote-info-box[b-mpdrff1uy7] {
        padding: 0.75rem !important;
    }

    .lote-form-label[b-mpdrff1uy7] {
        font-size: 0.813rem;
    }

    .lote-help-text[b-mpdrff1uy7] {
        font-size: 0.75rem;
    }
}
/* /Components/Pages/Dashboards/Lotes/Index.razor.rz.scp.css */
/* ==========================================
   LOTES DASHBOARD - ESTILOS PERSONALIZADOS
   Temática consistente con otros dashboards
   ========================================== */

/* Variables locales solo para lotes-dashboard */
.lotes-dashboard[b-6d8e8c8sjk] {
    --ld-primary: #6366f1;
    --ld-success: #10b981;
    --ld-danger: #ef4444;
    --ld-warning: #f59e0b;
    --ld-info: #3b82f6;
    --ld-bg-card: #ffffff;
    --ld-bg-secondary: #f8f9fa;
    --ld-text-primary: #212529;
    --ld-text-secondary: #6c757d;
    --ld-border-color: #dee2e6;
    --ld-hover-bg: rgba(0, 0, 0, 0.02);
}

/* Modo oscuro */
[data-theme-mode="dark"] .lotes-dashboard[b-6d8e8c8sjk] {
    --ld-bg-card: #1e1e1e;
    --ld-bg-secondary: #2a2a2a;
    --ld-text-primary: #e6e6e6;
    --ld-text-secondary: #b0b0b0;
    --ld-border-color: rgba(255, 255, 255, 0.1);
    --ld-hover-bg: rgba(255, 255, 255, 0.05);
}

/* ==========================================
   ENCABEZADO
   ========================================== */
.lotes-dashboard .page-title[b-6d8e8c8sjk] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0;
    color: var(--ld-text-primary);
}

.lotes-dashboard .page-subtitle[b-6d8e8c8sjk] {
    font-size: 0.813rem;
    color: var(--ld-text-secondary);
}

.lotes-dashboard .header-content[b-6d8e8c8sjk] {
    transition: all 0.3s ease;
}

/* ==========================================
   SECCIÓN DE PRODUCTOS DISPONIBLES
   ========================================== */
.lotes-dashboard .productos-header[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-secondary);
    border-radius: 8px 8px 0 0;
    padding: 1rem 1.25rem;
    border-bottom: 2px solid var(--ld-border-color);
}

.lotes-dashboard .productos-title[b-6d8e8c8sjk] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--ld-text-primary);
    margin-bottom: 0.25rem;
}

.lotes-dashboard .productos-subtitle[b-6d8e8c8sjk] {
    font-size: 0.75rem;
    color: var(--ld-text-secondary);
    margin-bottom: 0;
}

.lotes-dashboard .productos-controls[b-6d8e8c8sjk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.lotes-dashboard .productos-controls .search-box[b-6d8e8c8sjk] {
    flex: 1 1 200px;
    min-width: 0;
}

.lotes-dashboard .productos-controls .productos-page-size[b-6d8e8c8sjk] {
    flex: 0 0 auto;
    width: auto;
    min-width: 70px;
    max-width: 90px;
}

.lotes-dashboard .productos-controls-right[b-6d8e8c8sjk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 0 0 auto;
}


.lotes-dashboard .badge-category[b-6d8e8c8sjk] {
    background-color: rgba(99, 102, 241, 0.1);
    color: var(--ld-primary);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
}

.lotes-dashboard .badge-status[b-6d8e8c8sjk] {
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

    .lotes-dashboard .badge-status.status-active[b-6d8e8c8sjk] {
        background-color: rgba(16, 185, 129, 0.1);
        color: var(--ld-success);
    }

    .lotes-dashboard .badge-status.status-inactive[b-6d8e8c8sjk] {
        background-color: rgba(239, 68, 68, 0.1);
        color: var(--ld-danger);
    }

.lotes-dashboard .status-dot[b-6d8e8c8sjk] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

.lotes-dashboard .badge-status.status-active .status-dot[b-6d8e8c8sjk] {
    background-color: var(--ld-success);
}

.lotes-dashboard .badge-status.status-inactive .status-dot[b-6d8e8c8sjk] {
    background-color: var(--ld-danger);
}

/* ==========================================
   TABLA
   ========================================== */
.lotes-dashboard .table-modern[b-6d8e8c8sjk] {
    margin-bottom: 0;
    color: var(--ld-text-primary);
}

    .lotes-dashboard .table-modern thead th[b-6d8e8c8sjk] {
        background-color: var(--ld-bg-secondary);
        border-bottom: 2px solid var(--ld-border-color);
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        color: var(--ld-text-secondary);
        padding: 0.75rem;
    }

    .lotes-dashboard .table-modern tbody tr[b-6d8e8c8sjk] {
        transition: background-color 0.15s ease;
        border-bottom: 1px solid var(--ld-border-color);
    }

        .lotes-dashboard .table-modern tbody tr:hover[b-6d8e8c8sjk] {
            background-color: var(--ld-hover-bg);
        }

    .lotes-dashboard .table-modern tbody td[b-6d8e8c8sjk] {
        padding: 0.75rem;
        vertical-align: middle;
        font-size: 0.875rem;
        color: var(--ld-text-primary);
    }

.lotes-dashboard .product-code[b-6d8e8c8sjk] {
    font-family: 'Courier New', monospace;
    font-weight: 600;
    color: var(--ld-primary);
    background-color: rgba(99, 102, 241, 0.08);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.813rem;
}

.lotes-dashboard .product-name[b-6d8e8c8sjk] {
    font-weight: 600;
    color: var(--ld-text-primary);
}

.lotes-dashboard .product-description[b-6d8e8c8sjk] {
    color: var(--ld-text-secondary);
    font-size: 0.813rem;
}

/* ==========================================
   CONTROLES DE BÚSQUEDA
   ========================================== */
.lotes-dashboard .search-box[b-6d8e8c8sjk] {
    flex: 1;
    min-width: 250px;
}

.lotes-dashboard .input-group-text[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-card);
    border: 1px solid var(--ld-border-color);
    border-right: 0;
    color: var(--ld-text-secondary);
}

.lotes-dashboard .form-control[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-card);
    border: 1px solid var(--ld-border-color);
    border-left: 0;
    color: var(--ld-text-primary);
}

    .lotes-dashboard .form-control[b-6d8e8c8sjk]::placeholder {
        color: var(--ld-text-secondary);
    }

    .lotes-dashboard .form-control:focus[b-6d8e8c8sjk] {
        background-color: var(--ld-bg-card);
        box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25);
        border-color: var(--ld-primary);
        color: var(--ld-text-primary);
    }

        .lotes-dashboard .form-control:focus + .input-group-text[b-6d8e8c8sjk],
        .lotes-dashboard .input-group:focus-within .input-group-text[b-6d8e8c8sjk] {
            border-color: var(--ld-primary);
        }

.lotes-dashboard .form-select-modern[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-card);
    border: 1px solid var(--ld-border-color);
    color: var(--ld-text-primary);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.5rem 2rem 0.5rem 0.75rem;
}

    .lotes-dashboard .form-select-modern:focus[b-6d8e8c8sjk] {
        background-color: var(--ld-bg-card);
        border-color: var(--ld-primary);
        box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25);
        color: var(--ld-text-primary);
    }

/* ==========================================
   BOTONES
   ========================================== */
.lotes-dashboard .btn-create-lote[b-6d8e8c8sjk] {
    font-size: 0.813rem;
    font-weight: 600;
    padding: 0.375rem 0.75rem;
    background-color: #8b5cf6;
    border-color: #8b5cf6;
    color: #ffffff;
    transition: all 0.2s ease;
}

    .lotes-dashboard .btn-create-lote:hover[b-6d8e8c8sjk] {
        background-color: #7c3aed;
        border-color: #7c3aed;
        color: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 4px 8px rgba(139, 92, 246, 0.3);
    }

    .lotes-dashboard .btn-create-lote:active[b-6d8e8c8sjk] {
        background-color: #6d28d9;
        border-color: #6d28d9;
        transform: translateY(0);
    }

    .lotes-dashboard .btn-create-lote:focus[b-6d8e8c8sjk] {
        box-shadow: 0 0 0 0.2rem rgba(139, 92, 246, 0.5);
    }

/* Modo oscuro - asegurar visibilidad del hover */
[data-theme-mode="dark"] .lotes-dashboard .btn-create-lote[b-6d8e8c8sjk] {
    background-color: #9333ea;
    border-color: #9333ea;
}

    [data-theme-mode="dark"] .lotes-dashboard .btn-create-lote:hover[b-6d8e8c8sjk] {
        background-color: #a855f7;
        border-color: #a855f7;
        box-shadow: 0 4px 8px rgba(168, 85, 247, 0.4);
    }

    [data-theme-mode="dark"] .lotes-dashboard .btn-create-lote:active[b-6d8e8c8sjk] {
        background-color: #7e22ce;
        border-color: #7e22ce;
    }

.lotes-dashboard .btn-icon[b-6d8e8c8sjk] {
    width: 38px;
    height: 38px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ==========================================
   PAGINACIÓN
   ========================================== */
.lotes-dashboard .pagination-info[b-6d8e8c8sjk] {
    font-size: 0.875rem;
    color: var(--ld-text-secondary);
}

    .lotes-dashboard .pagination-info strong[b-6d8e8c8sjk] {
        color: var(--ld-text-primary);
    }

.lotes-dashboard .pagination-modern .page-link[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-card);
    border: 1px solid var(--ld-border-color);
    color: var(--ld-text-primary);
    border-radius: 4px;
    margin: 0 0.125rem;
    min-width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .lotes-dashboard .pagination-modern .page-link:hover:not(:disabled)[b-6d8e8c8sjk] {
        background-color: var(--ld-hover-bg);
        border-color: var(--ld-primary);
    }

.lotes-dashboard .pagination-modern .page-item.active .page-link[b-6d8e8c8sjk] {
    background-color: var(--ld-primary);
    border-color: var(--ld-primary);
    color: #ffffff;
}

.lotes-dashboard .pagination-modern .page-item.disabled .page-link[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-secondary);
    border-color: var(--ld-border-color);
    color: var(--ld-text-secondary);
    opacity: 0.6;
}

.lotes-dashboard .card-footer[b-6d8e8c8sjk] {
    background-color: var(--ld-bg-secondary);
    border-top: 2px solid var(--ld-border-color);
}

/* ==========================================
   ESTADOS VACÍOS
   ========================================== */
.lotes-dashboard .empty-state[b-6d8e8c8sjk] {
    padding: 3rem 1.5rem;
    text-align: center;
}

    .lotes-dashboard .empty-state i[b-6d8e8c8sjk] {
        font-size: 3rem;
        color: var(--ld-border-color);
        margin-bottom: 1rem;
    }

    .lotes-dashboard .empty-state p[b-6d8e8c8sjk] {
        color: var(--ld-text-secondary);
        font-size: 0.875rem;
        margin-bottom: 0;
    }

/* ==========================================
   GRÁFICOS
   ========================================== */
.lotes-dashboard .chart-card[b-6d8e8c8sjk] {
    transition: box-shadow 0.2s ease;
    background-color: var(--ld-bg-card);
    border-color: var(--ld-border-color);
}

    .lotes-dashboard .chart-card:hover[b-6d8e8c8sjk] {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    }

    .lotes-dashboard .chart-card .card-header[b-6d8e8c8sjk] {
        background-color: transparent;
        border-bottom: 2px solid var(--ld-border-color);
    }

    .lotes-dashboard .chart-card .card-title[b-6d8e8c8sjk] {
        color: var(--ld-text-primary);
    }

    .lotes-dashboard .chart-card .card-subtitle[b-6d8e8c8sjk] {
        color: var(--ld-text-secondary);
    }

.lotes-dashboard .chart-indicator[b-6d8e8c8sjk] {
    display: flex;
    align-items: center;
}

.lotes-dashboard .indicator-dot[b-6d8e8c8sjk] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--ld-border-color);
}

    .lotes-dashboard .indicator-dot.active[b-6d8e8c8sjk] {
        background-color: var(--ld-success);
        box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
    }

/* ==========================================
   ALERTAS
   ========================================== */
.lotes-dashboard .alert-modern[b-6d8e8c8sjk] {
    border-radius: 8px;
    font-size: 0.875rem;
}

/* ==========================================
   ANIMACIONES SUTILES
   ========================================== */
@keyframes fadeInUp-b-6d8e8c8sjk {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

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

.lotes-dashboard .animate-fade-in[b-6d8e8c8sjk] {
    animation: fadeInUp-b-6d8e8c8sjk 0.3s ease-out;
}

/* ==========================================
   UTILIDADES ADICIONALES
   ========================================== */
.lotes-dashboard .th-content[b-6d8e8c8sjk],
.lotes-dashboard .td-content[b-6d8e8c8sjk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}


/* ==========================================
   RESPONSIVE
   ========================================== */
@media (max-width: 768px) {
    .lotes-dashboard .page-title[b-6d8e8c8sjk] {
        font-size: 1.125rem;
    }

    .lotes-dashboard .search-box[b-6d8e8c8sjk] {
        min-width: 0;
    }

    .lotes-dashboard .table-modern[b-6d8e8c8sjk] {
        font-size: 0.813rem;
    }

    .lotes-dashboard .productos-controls[b-6d8e8c8sjk] {
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        width: 100%;
    }

    .lotes-dashboard .productos-controls .search-box[b-6d8e8c8sjk] {
        flex: 1 1 100%;
        width: 100%;
    }

    .lotes-dashboard .productos-controls .productos-page-size[b-6d8e8c8sjk] {
        flex: 0 0 auto;
    }

    .lotes-dashboard .productos-controls-right[b-6d8e8c8sjk] {
        margin-left: auto;
        justify-content: flex-end;
    }
}

@media (min-width: 769px) {
    .lotes-dashboard .productos-controls[b-6d8e8c8sjk] {
        justify-content: space-between;
    }
}
/* /Components/Pages/Dashboards/Lotes/ListarLote.razor.rz.scp.css */
/* Oculta la columna de precio de venta sin modificar el markup ni la logica. */
.table.align-middle thead th:nth-child(9)[b-ih41l2lwsz],
.table.align-middle tbody td:nth-child(9)[b-ih41l2lwsz] {
    display: none;
}
/* /Components/Pages/Dashboards/Productos/CrearProducto.razor.rz.scp.css */
:root[b-mh2bc3ytnc] {
    --bg-dark: #1e1e2f;
    --bg-card: #2b2b3c;
    --text-light: #f1f1f1;
    --accent: #0ea5e9;
    --accent-hover: #38bdf8;
    --error: #ef4444;
    --success: #22c55e;
}

/* Estructura general */
body[b-mh2bc3ytnc],
.titulo-form[b-mh2bc3ytnc],
.descripcion-form[b-mh2bc3ytnc] {
    color: var(--text-light);
}

.titulo-form[b-mh2bc3ytnc] {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
}

.descripcion-form[b-mh2bc3ytnc] {
    font-size: 0.9rem;
    color: #b0b0b0;
    margin-bottom: 1.5rem;
}

/* --- Contenedor del componente (Blazor CSS isolation) --- */
:host[b-mh2bc3ytnc] {
    display: block;
    padding-bottom: 4rem; /* separa el contenido del borde inferior */
}

/* Formulario */
.form-grid[b-mh2bc3ytnc] {
    display: grid;
    /* antes: repeat(3, 1fr) -> ahora responsivo */
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    grid-auto-rows: auto;
    gap: 1.2rem;
    background-color: var(--bg-card);
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
    margin-bottom: 1.5rem; /* aire extra antes de acciones/footer */
}

/* Hace que la descripción ocupe toda la fila disponible */
.descripcion[b-mh2bc3ytnc] {
    grid-column: 1 / -1; /* ocupa todas las columnas de la grilla */
}

.campo label[b-mh2bc3ytnc] {
    display: block;
    margin-bottom: 0.3rem;
    font-weight: 500;
}

.form-control[b-mh2bc3ytnc] {
    width: 100%;
    background-color: #1c1c2b;
    color: var(--text-light);
    border: 1px solid #3a3a4a;
    border-radius: 8px;
    padding: 0.6rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

    .form-control:focus[b-mh2bc3ytnc] {
        outline: none;
        border-color: var(--accent);
        box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.3);
    }

/* Validaciones */
.validation-message[b-mh2bc3ytnc],
.text-danger[b-mh2bc3ytnc] {
    color: var(--error);
    font-size: 0.8rem;
    margin-top: 0.2rem;
}

/* Botones (bloque simple de acciones del form) */
.acciones[b-mh2bc3ytnc] {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem; /* extra gap antes del borde */
    display: flex;
    gap: 1rem;
}

.btn-guardar[b-mh2bc3ytnc],
.btn-cancelar[b-mh2bc3ytnc] {
    padding: 0.7rem 1.3rem;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s, transform .06s ease, box-shadow .2s ease;
}

.btn-guardar[b-mh2bc3ytnc] {
    background-color: var(--accent);
    color: #fff;
}

    .btn-guardar:hover[b-mh2bc3ytnc] {
        background-color: var(--accent-hover);
    }

.btn-cancelar[b-mh2bc3ytnc] {
    background-color: #444;
    color: #ddd;
}

    .btn-cancelar:hover[b-mh2bc3ytnc] {
        background-color: #555;
    }

/* Mensaje de éxito */
.alerta-exito[b-mh2bc3ytnc] {
    margin-top: 1rem;
    background-color: rgba(34, 197, 94, 0.15);
    color: var(--success);
    padding: 0.8rem 1rem;
    border-radius: 8px;
    border: 1px solid rgba(34, 197, 94, 0.3);
    font-size: 0.9rem;
}

/* Fila de acciones “estilo botones bootstrap” (si la usas) */
.form-actions[b-mh2bc3ytnc] {
    margin-top: 1.25rem;
    gap: .6rem;
    flex-wrap: wrap;
}

    .form-actions > .btn[b-mh2bc3ytnc] {
        --btn-radius: .6rem;
        --btn-padding-y: .55rem;
        --btn-padding-x: 1rem;
        --btn-font: 500;
        border-radius: var(--btn-radius);
        padding: var(--btn-padding-y) var(--btn-padding-x);
        font-weight: var(--btn-font);
        transition: transform .06s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
        box-shadow: 0 0 0 0 rgba(0,0,0,0);
    }

        .form-actions > .btn:hover:not(:disabled)[b-mh2bc3ytnc] {
            transform: translateY(-1px);
        }

        .form-actions > .btn:focus-visible[b-mh2bc3ytnc] {
            outline: 0;
            box-shadow: 0 0 0 .2rem rgba(14,165,233,.25);
        }

        .form-actions > .btn:disabled[b-mh2bc3ytnc] {
            opacity: .6;
            cursor: not-allowed;
            transform: none;
        }

        /* Primario (Guardar) */
        .form-actions > .btn.btn-primary[b-mh2bc3ytnc] {
            background: var(--primary-bg, #0ea5e9);
            border-color: var(--primary-bg, #0ea5e9);
            color: var(--on-primary, #fff);
        }

            .form-actions > .btn.btn-primary:hover:not(:disabled)[b-mh2bc3ytnc] {
                background: color-mix(in srgb, var(--primary-bg, #0ea5e9) 92%, #000);
                border-color: color-mix(in srgb, var(--primary-bg, #0ea5e9) 92%, #000);
            }

        /* Contorno (Limpiar) */
        .form-actions > .btn.btn-outline-secondary[b-mh2bc3ytnc] {
            --b: var(--default-border, #2b2f36);
            --t: var(--default-text-color, #e5e7eb);
            background: transparent;
            border-color: var(--b);
            color: var(--t);
        }

            .form-actions > .btn.btn-outline-secondary:hover:not(:disabled)[b-mh2bc3ytnc] {
                background: color-mix(in srgb, var(--b) 14%, transparent);
                border-color: color-mix(in srgb, var(--b) 80%, #888);
            }

        /* Ligero (Volver) */
        .form-actions > .btn.btn-light[b-mh2bc3ytnc] {
            --bg: var(--form-control-bg, #0f1115);
            --tx: var(--default-text-color, #e5e7eb);
            --bd: var(--default-border, #2b2f36);
            background: var(--bg);
            color: var(--tx);
            border: 1px solid var(--bd);
        }

            .form-actions > .btn.btn-light:hover[b-mh2bc3ytnc] {
                background: color-mix(in srgb, var(--bg) 85%, #fff);
                border-color: color-mix(in srgb, var(--bd) 80%, #888);
            }

/* === Separación inferior para el layout general (si usas wrapper) === */
.productos-dashboard[b-mh2bc3ytnc] {
    padding-bottom: 3rem;
}
/* espacio adicional inferior */
.main-content.app-content .productos-dashboard[b-mh2bc3ytnc] {
    padding-bottom: 4rem !important;
}

/* También puedes aplicar margen inferior al bloque de botones o al form */
.productos-dashboard .acciones[b-mh2bc3ytnc],
.productos-dashboard form[b-mh2bc3ytnc] {
    margin-bottom: 2.5rem; /* aire antes del fin del contenido */
}
/* --- Forzar espacio inferior en el contenedor del layout --- */
:global(.app-content .main-body-container)[b-mh2bc3ytnc],
:global(#MainLayoutContainer.container-fluid.page-container.main-body-container)[b-mh2bc3ytnc] {
    padding-block-end: 2.75rem !important; /* respeta writing-mode */
    padding-bottom: 2.75rem !important; /* fallback directo */
}

/* Si el footer todavía queda pegado, da aire extra al footer */
:global(footer.footer)[b-mh2bc3ytnc] {
    margin-top: 1rem !important;
}
.bottom-spacer[b-mh2bc3ytnc] {
    height: 3rem;
}


/* Móvil: apilar botones al 100% si usas .form-actions */
@media (max-width: 576px) {
    .form-actions > .btn[b-mh2bc3ytnc] {
        width: 100%;
    }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .form-actions > .btn[b-mh2bc3ytnc] {
        transition: none;
    }
}
/* /Components/Pages/Dashboards/Productos/DetalleProducto.razor.rz.scp.css */
/* Detalle de producto: en mobile, algunas secciones (Stock, Lotes, Foto)
   arrancan colapsadas para no saturar al usuario con todo a la vez —
   solo "Información del Producto" queda abierta por defecto. En desktop
   (>=1200px, mismo breakpoint que las columnas col-xl-*) se fuerza que
   todo quede expandido siempre, sin importar el estado de Bootstrap,
   para no cambiar el comportamiento que ya tenían las pantallas grandes. */

.detalle-toggle[b-ivrfon1j8d] {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    user-select: none;
}

.detalle-chevron[b-ivrfon1j8d] {
    transition: transform 0.2s ease;
    color: var(--text-muted, #6c757d);
}

.detalle-toggle.collapsed .detalle-chevron[b-ivrfon1j8d] {
    transform: rotate(-90deg);
}

@media (min-width: 1200px) {
    .detalle-card .collapse[b-ivrfon1j8d] {
        display: block !important;
    }

    .detalle-toggle[b-ivrfon1j8d] {
        cursor: default;
    }

    .detalle-chevron[b-ivrfon1j8d] {
        display: none;
    }
}
/* /Components/Pages/Dashboards/Productos/EditarProducto.razor.rz.scp.css */
/* ===== Título y descripción ===== */
.titulo-form[b-twv4zzmpiu] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #e5e7eb; /* mismo tono claro usado en crear */
    margin-bottom: 0.25rem;
}

.descripcion-form[b-twv4zzmpiu] {
    color: #9ca3af;
    margin-bottom: 1rem;
}

/* ===== Estructura del formulario ===== */
.form-grid[b-twv4zzmpiu] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0.75rem;
}

.campo[b-twv4zzmpiu] {
    grid-column: span 6;
}

    .campo.descripcion[b-twv4zzmpiu] {
        grid-column: span 12;
    }

/* ===== Campos ===== */
.form-control[b-twv4zzmpiu] {
    background: #111827;
    border: 1px solid #253047;
    color: #e5e7eb;
    padding: 0.6rem 0.75rem;
    border-radius: 0.5rem;
    width: 100%;
    transition: border-color 0.2s, box-shadow 0.2s;
}

    .form-control:focus[b-twv4zzmpiu] {
        outline: none;
        border-color: #3b82f6; /* azul acento igual al crear */
        box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
    }

/* ===== Botones ===== */
.acciones[b-twv4zzmpiu] {
    display: flex;
    gap: 0.5rem;
    margin-top: 1rem;
}

.btn-guardar[b-twv4zzmpiu],
.btn-cancelar[b-twv4zzmpiu] {
    border: 0;
    border-radius: 0.5rem;
    padding: 0.6rem 1rem;
    font-weight: 600;
    cursor: pointer;
}

.btn-guardar[b-twv4zzmpiu] {
    background: #2563eb; /* azul principal */
    color: white;
}

    .btn-guardar:hover[b-twv4zzmpiu] {
        background: #1d4ed8;
    }

.btn-cancelar[b-twv4zzmpiu] {
    background: #374151;
    color: #e5e7eb;
}

    .btn-cancelar:hover[b-twv4zzmpiu] {
        background: #4b5563;
    }

/* ===== Mensajes ===== */
.alerta-exito[b-twv4zzmpiu] {
    background-color: rgba(59, 130, 246, 0.15);
    border: 1px solid rgba(59, 130, 246, 0.3);
    color: #3b82f6;
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin-top: 1rem;
}
.badge-id-pill[b-twv4zzmpiu] {
    border-radius: 9999px;
    padding: .18rem .6rem;
    font-weight: 600;
    font-size: .75rem;
    letter-spacing: .02em;
    background: #f1f5f9; 
    color: #0f172a; 
    border: 1px solid #e2e8f0;
}

[data-theme-mode="dark"] .badge-id-pill[b-twv4zzmpiu] {
    background: #020617; 
    color: #f9fafb;
    border-color: #1f2937;
}

/* ===== Responsivo ===== */
@media (max-width: 992px) {
    .campo[b-twv4zzmpiu] {
        grid-column: span 12;
    }
}

/* Foto del producto: colapsada por defecto en mobile (bulky visualmente,
   no siempre hace falta tocarla) — en desktop (>=lg) siempre expandida,
   sin importar el estado de Bootstrap. */
.editar-foto-toggle[b-twv4zzmpiu] {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    user-select: none;
}

.editar-foto-chevron[b-twv4zzmpiu] {
    transition: transform 0.2s ease;
}

.editar-foto-toggle[aria-expanded="false"] .editar-foto-chevron[b-twv4zzmpiu] {
    transform: rotate(-90deg);
}

@media (min-width: 992px) {
    #ep-foto.collapse[b-twv4zzmpiu] {
        display: block !important;
    }

    .editar-foto-toggle[b-twv4zzmpiu] {
        cursor: default;
    }

    .editar-foto-chevron[b-twv4zzmpiu] {
        display: none;
    }
}
/* /Components/Pages/Dashboards/Productos/Index.razor.rz.scp.css */
/* ===== Ajustes modo oscuro (mejor contraste) ===== */
html[data-theme-mode="dark"] .productos-dashboard[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard[b-oq4e6xfmfg],
.dark .productos-dashboard[b-oq4e6xfmfg] {
    /* Números y colores vivos para iconos */
    --pd-number: #ffffff;
    --pd-icon-primary: #60a5ff; /* azul brillante */
    --pd-icon-warning: #ffd369; /* ámbar brillante */
    --pd-icon-success: #4ade80; /* verde brillante */
    --pd-success: #22c55e;
    --pd-danger: #f87171;
}

/* (A) Si puedes: marca el número con .kpi-value */
.productos-dashboard .kpi-value[b-oq4e6xfmfg] {
    color: var(--pd-text); /* claro */
    font-size: 1.875rem; /* ~ fs-3 */
    font-weight: 600;
}
kpi-number[b-oq4e6xfmfg] {
    color: inherit;
}


[data-theme-mode="dark"] .kpi-number[b-oq4e6xfmfg] {
    color: #ffffff;
}

html[data-theme-mode="dark"] .productos-dashboard .kpi-value[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .kpi-value[b-oq4e6xfmfg],
.dark .productos-dashboard .kpi-value[b-oq4e6xfmfg] {
    color: var(--pd-number); /* blanco puro en oscuro */
}

/* (B) Si NO puedes tocar el HTML: fuerza el color del número grande dentro de la card */
html[data-theme-mode="dark"] .productos-dashboard .card .fs-3.fw-semibold[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .card .fs-3.fw-semibold[b-oq4e6xfmfg],
.dark .productos-dashboard .card .fs-3.fw-semibold[b-oq4e6xfmfg] {
    color: var(--pd-number) !important;
}

/* Éxitos/errores más visibles en oscuro */
html[data-theme-mode="dark"] .productos-dashboard .text-success[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .text-success[b-oq4e6xfmfg],
.dark .productos-dashboard .text-success[b-oq4e6xfmfg] {
    color: var(--pd-success) !important;
}

html[data-theme-mode="dark"] .productos-dashboard .text-danger[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .text-danger[b-oq4e6xfmfg],
.dark .productos-dashboard .text-danger[b-oq4e6xfmfg] {
    color: var(--pd-danger) !important;
}

/* Iconos de accesos rápidos más brillantes en oscuro */
html[data-theme-mode="dark"] .productos-dashboard .bg-primary-subtle i[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .bg-primary-subtle i[b-oq4e6xfmfg],
.dark .productos-dashboard .bg-primary-subtle i[b-oq4e6xfmfg] {
    color: var(--pd-icon-primary) !important;
}

html[data-theme-mode="dark"] .productos-dashboard .bg-warning-subtle i[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .bg-warning-subtle i[b-oq4e6xfmfg],
.dark .productos-dashboard .bg-warning-subtle i[b-oq4e6xfmfg] {
    color: var(--pd-icon-warning) !important;
}

html[data-theme-mode="dark"] .productos-dashboard .bg-success-subtle i[b-oq4e6xfmfg],
body[data-theme-mode="dark"] .productos-dashboard .bg-success-subtle i[b-oq4e6xfmfg],
.dark .productos-dashboard .bg-success-subtle i[b-oq4e6xfmfg] {
    color: var(--pd-icon-success) !important;
}
 
html[data-theme-mode="dark"] .productos-dashboard .table thead th[b-oq4e6xfmfg] {
    color: #cbd5e1 !important; /* un gris claro legible */
}
 
/* /Components/Pages/Dashboards/Productos/ListarProducto.razor.rz.scp.css */
.producto-card-mobile:active[b-60hfbw8wdz] {
    background: var(--form-control-bg, #f8fafc);
}
/* /Components/Pages/Dashboards/reporte-general/Index.razor.rz.scp.css */
.report-card-style[b-n0k09hl35k] {
    border: none;
    border-radius: 0.75rem;
    cursor: pointer;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
    animation: slideInUpCard-b-n0k09hl35k 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) backwards;
}

.stats-row .col:nth-of-type(1) .report-card-style[b-n0k09hl35k] { animation-delay: 0.1s; }
.stats-row .col:nth-of-type(2) .report-card-style[b-n0k09hl35k] { animation-delay: 0.2s; }
.stats-row .col:nth-of-type(3) .report-card-style[b-n0k09hl35k] { animation-delay: 0.3s; }
.stats-row .col:nth-of-type(4) .report-card-style[b-n0k09hl35k] { animation-delay: 0.4s; }

.report-card-style:hover[b-n0k09hl35k] {
    transform: translateY(-5px);
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.12) !important;
}

.report-card-style .icon-wrapper[b-n0k09hl35k] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.12), rgba(79, 70, 229, 0.12));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.report-card-style .icon-wrapper i[b-n0k09hl35k] {
    font-size: 1.5rem;
    color: #6366f1;
    transition: transform 0.3s ease;
}

.report-card-style:hover .icon-wrapper[b-n0k09hl35k] {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(79, 70, 229, 0.2));
}

.report-card-style:hover .icon-wrapper i[b-n0k09hl35k] {
    transform: scale(1.15);
}

.report-card-style h5[b-n0k09hl35k] {
    font-weight: 600;
    margin-bottom: 0.15rem;
}

.report-card-style small[b-n0k09hl35k] {
    font-size: 0.8rem;
}

.card.shadow-sm.p-4.mb-5[b-n0k09hl35k] {
    border: none;
    border-radius: 0.75rem;
    animation: slideInUpCard-b-n0k09hl35k 0.4s ease backwards;
}

.form-control[b-n0k09hl35k] {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus[b-n0k09hl35k] {
    border-color: #6366f1;
    box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.15);
    transform: translateY(-1px);
}

.btn[b-n0k09hl35k] {
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn:hover[b-n0k09hl35k] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.btn:active[b-n0k09hl35k] {
    transform: translateY(0);
}

.btn-primary[b-n0k09hl35k] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    border: none;
}

.btn-primary:hover[b-n0k09hl35k] {
    background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
    box-shadow: 0 8px 20px rgba(99, 102, 241, 0.4);
}

@keyframes slideInUpCard-b-n0k09hl35k {
    0% { opacity: 0; transform: translateY(30px) scale(0.95); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

[data-theme-mode="dark"] .report-card-style[b-n0k09hl35k] {
    background: #1e1e2d;
    border-color: #2b2b40;
}

[data-theme-mode="dark"] .report-card-style .icon-wrapper[b-n0k09hl35k] {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(79, 70, 229, 0.2));
}

[data-theme-mode="dark"] .report-card-style .icon-wrapper i[b-n0k09hl35k] {
    color: #818cf8;
}

[data-theme-mode="dark"] .report-card-style h5[b-n0k09hl35k] {
    color: #ffffff;
}

[data-theme-mode="dark"] .report-card-style small[b-n0k09hl35k] {
    color: #9ca3af !important;
}

[data-theme-mode="dark"] .card.shadow-sm.p-4.mb-5[b-n0k09hl35k] {
    background: #1e1e2d;
    border-color: #2b2b40;
}

[data-theme-mode="dark"] .form-control[b-n0k09hl35k] {
    background-color: #1e1e2d;
    border-color: #374151;
    color: #e5e7eb;
}

[data-theme-mode="dark"] .form-control:focus[b-n0k09hl35k] {
    background-color: #1e1e2d;
    border-color: #6366f1;
    color: #e5e7eb;
}

[data-theme-mode="dark"] label[b-n0k09hl35k],
[data-theme-mode="dark"] .page-title[b-n0k09hl35k] {
    color: #e5e7eb;
}
/* /Components/Pages/Dashboards/reporte-general/PdfModal.razor.rz.scp.css */
.pdf-modal-backdrop[b-34ts59tchu] {
    animation: fadeIn-b-34ts59tchu 0.25s ease-out forwards;
}

.pdf-modal-container[b-34ts59tchu] {
    animation: modalPopIn-b-34ts59tchu 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.close-btn[b-34ts59tchu] {
    background: transparent;
    border: none;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.4rem;
    font-weight: 300;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #6b7280;
    line-height: 1;
}

.close-btn:hover[b-34ts59tchu] {
    background: rgba(99, 102, 241, 0.1);
    color: #6366f1;
    transform: rotate(90deg);
}

@keyframes fadeIn-b-34ts59tchu {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes modalPopIn-b-34ts59tchu {
    0% { opacity: 0; transform: scale(0.8) translateY(20px); }
    100% { opacity: 1; transform: scale(1) translateY(0); }
}

[data-theme-mode="dark"] .close-btn[b-34ts59tchu] {
    color: #9ca3af;
}

[data-theme-mode="dark"] .close-btn:hover[b-34ts59tchu] {
    background: rgba(99, 102, 241, 0.2);
    color: #818cf8;
}
/* /Components/Pages/Dashboards/Usuarios/EditarUsuarios.razor.rz.scp.css */
.badge-id-pill[b-pbqb2jmot4] {
    border-radius: 9999px;
    padding: .18rem .6rem;
    font-weight: 600;
    font-size: .75rem;
    letter-spacing: .02em;
    background: #f1f5f9;
    color: #0f172a;
    border: 1px solid #e2e8f0;
}

[data-theme-mode="dark"] .badge-id-pill[b-pbqb2jmot4] {
    background: #020617;
    color: #f9fafb;
    border-color: #1f2937;
}
/* /Components/Pages/Dashboards/Usuarios/Index.razor.rz.scp.css */
kpi-number[b-ooglrrko59] {
    color: inherit;
}


[data-theme-mode="dark"] .kpi-number[b-ooglrrko59] {
    color: #ffffff;
}

/* Quick access cards — efecto botón con más sombra */
.empleados-dashboard .hover-shadow[b-ooglrrko59] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    cursor: pointer;
}

.empleados-dashboard .hover-shadow:hover[b-ooglrrko59] {
    transform: translateY(-3px);
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.2) !important;
}

[data-theme-mode="dark"] .empleados-dashboard .hover-shadow:hover[b-ooglrrko59],
body[data-theme-mode="dark"] .empleados-dashboard .hover-shadow:hover[b-ooglrrko59],
.dark .empleados-dashboard .hover-shadow:hover[b-ooglrrko59] {
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.4) !important;
}
/* /Components/Pages/pages/Authentication/ResetPassword/Basic.razor.rz.scp.css */
#login-bg[b-wnbkr0f5jc] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.container[b-wnbkr0f5jc] {
    position: relative;
    z-index: 2;
}
/* /Components/Pages/pages/Authentication/ResetPassword/RecuperacionPassword.razor.rz.scp.css */
/* ==================== ESTILOS RECOVERY PASSWORD - DARK/LIGHT MODE ==================== */

/* Base */
html[b-c010nz1knx], body[b-c010nz1knx] {
    height: 100%;
    margin: 0;
}

/* Backgrounds - Ya configurados con tsParticles */
.authentication-background[b-c010nz1knx],
.auth-bg-wrapper[b-c010nz1knx] {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
}

#login-bg[b-c010nz1knx] {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0;
    pointer-events: none;
}

.authentication-basic-background[b-c010nz1knx] {
    position: fixed;
    inset: 0;
    z-index: -1;
}

    .authentication-basic-background img[b-c010nz1knx] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

/* Contenedor centrado */
.auth-center[b-c010nz1knx] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
    position: relative;
    z-index: 1;
}

/* Card con tema dark/light */
.auth-card-wide[b-c010nz1knx] {
    width: 100%;
    max-width: 480px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    animation: fadeInCard-b-c010nz1knx 0.4s ease;
}

/* Dark mode card */
[data-theme-mode="dark"] .auth-card-wide[b-c010nz1knx],
body.dark-mode .auth-card-wide[b-c010nz1knx] {
    background: rgba(30, 30, 46, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.auth-card-wide:hover[b-c010nz1knx] {
    transform: translateY(-2px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

[data-theme-mode="dark"] .auth-card-wide:hover[b-c010nz1knx],
body.dark-mode .auth-card-wide:hover[b-c010nz1knx] {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}

@keyframes fadeInCard-b-c010nz1knx {
    from {
        opacity: 0;
        transform: scale(0.96) translateY(10px);
    }

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

/* Card body */
.auth-card-wide .card-body[b-c010nz1knx] {
    padding: 40px 32px !important;
}

/* Logo */
.auth-card-wide .auth-logo[b-c010nz1knx] {
    max-width: 140px;
    height: auto;
    display: inline-block;
    transition: all 0.3s ease;
}

    .auth-card-wide .auth-logo:hover[b-c010nz1knx] {
        transform: scale(1.05);
    }

/* Tipografía */
.auth-card-wide h4.fw-semibold[b-c010nz1knx] {
    font-size: 24px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

[data-theme-mode="dark"] .auth-card-wide h4.fw-semibold[b-c010nz1knx],
body.dark-mode .auth-card-wide h4.fw-semibold[b-c010nz1knx] {
    color: #e6e6e6;
}

.auth-card-wide .text-muted[b-c010nz1knx] {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.5;
}

[data-theme-mode="dark"] .auth-card-wide .text-muted[b-c010nz1knx],
body.dark-mode .auth-card-wide .text-muted[b-c010nz1knx] {
    color: #9ca3af;
}

/* Labels */
.auth-card-wide .form-label[b-c010nz1knx] {
    font-weight: 600;
    font-size: 13px;
    color: #374151;
    margin-bottom: 8px;
    display: block;
}

[data-theme-mode="dark"] .auth-card-wide .form-label[b-c010nz1knx],
body.dark-mode .auth-card-wide .form-label[b-c010nz1knx] {
    color: #d1d5db;
}

/* Inputs */
.auth-card-wide .form-control[b-c010nz1knx] {
    height: 44px;
    padding: 10px 14px;
    font-size: 14px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    transition: all 0.2s ease;
    background: #ffffff;
    color: #1a1a1a;
}

[data-theme-mode="dark"] .auth-card-wide .form-control[b-c010nz1knx],
body.dark-mode .auth-card-wide .form-control[b-c010nz1knx] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    color: #e6e6e6;
}

.auth-card-wide .form-control:focus[b-c010nz1knx] {
    outline: none;
    border-color: #845adf;
    box-shadow: 0 0 0 3px rgba(132, 90, 223, 0.1);
    background: #ffffff;
}

[data-theme-mode="dark"] .auth-card-wide .form-control:focus[b-c010nz1knx],
body.dark-mode .auth-card-wide .form-control:focus[b-c010nz1knx] {
    background: rgba(255, 255, 255, 0.08);
    border-color: #845adf;
    box-shadow: 0 0 0 3px rgba(132, 90, 223, 0.2);
}

.auth-card-wide .form-control[b-c010nz1knx]::placeholder {
    color: #9ca3af;
}

[data-theme-mode="dark"] .auth-card-wide .form-control[b-c010nz1knx]::placeholder,
body.dark-mode .auth-card-wide .form-control[b-c010nz1knx]::placeholder {
    color: #6b7280;
}

/* Mensajes de validación */
.auth-card-wide .validation-message[b-c010nz1knx] {
    color: #dc2626;
    font-size: 12px;
    margin-top: 6px;
    display: block;
    font-weight: 500;
    animation: slideIn-b-c010nz1knx 0.3s ease;
}

[data-theme-mode="dark"] .auth-card-wide .validation-message[b-c010nz1knx],
body.dark-mode .auth-card-wide .validation-message[b-c010nz1knx] {
    color: #f87171;
}

@keyframes slideIn-b-c010nz1knx {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

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

/* Botón principal */
.auth-card-wide .btn-primary[b-c010nz1knx] {
    height: 46px;
    padding: 12px 20px;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    background: linear-gradient(135deg, #845adf 0%, #6941c6 100%);
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(132, 90, 223, 0.25);
    position: relative;
    overflow: hidden;
}

    .auth-card-wide .btn-primary[b-c010nz1knx]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
        transition: left 0.5s ease;
    }

    .auth-card-wide .btn-primary:hover[b-c010nz1knx]::before {
        left: 100%;
    }

    .auth-card-wide .btn-primary:hover:not(:disabled)[b-c010nz1knx] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(132, 90, 223, 0.35);
        background: linear-gradient(135deg, #6941c6 0%, #5a34a8 100%);
    }

    .auth-card-wide .btn-primary:active:not(:disabled)[b-c010nz1knx] {
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(132, 90, 223, 0.25);
    }

    .auth-card-wide .btn-primary:disabled[b-c010nz1knx] {
        opacity: 0.65;
        cursor: not-allowed;
    }

/* Spinner del botón */
.auth-card-wide .spinner-border-sm[b-c010nz1knx] {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

/* Enlaces */
.auth-card-wide a.fw-medium[b-c010nz1knx] {
    color: #845adf;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.2s ease;
    position: relative;
    display: inline-block;
}

[data-theme-mode="dark"] .auth-card-wide a.fw-medium[b-c010nz1knx],
body.dark-mode .auth-card-wide a.fw-medium[b-c010nz1knx] {
    color: #a78bfa;
}

.auth-card-wide a.fw-medium[b-c010nz1knx]::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: currentColor;
    transition: width 0.3s ease;
}

.auth-card-wide a.fw-medium:hover[b-c010nz1knx] {
    color: #6941c6;
}

[data-theme-mode="dark"] .auth-card-wide a.fw-medium:hover[b-c010nz1knx],
body.dark-mode .auth-card-wide a.fw-medium:hover[b-c010nz1knx] {
    color: #c4b5fd;
}

.auth-card-wide a.fw-medium:hover[b-c010nz1knx]::after {
    width: 100%;
}

/* Responsive */
@media (max-width: 768px) {
    .auth-center[b-c010nz1knx] {
        padding: 24px 16px;
    }

    .auth-card-wide .card-body[b-c010nz1knx] {
        padding: 32px 24px !important;
    }

    .auth-card-wide h4.fw-semibold[b-c010nz1knx] {
        font-size: 22px;
    }
}

@media (max-width: 576px) {
    .auth-card-wide[b-c010nz1knx] {
        max-width: 100%;
        border-radius: 12px;
    }

        .auth-card-wide .card-body[b-c010nz1knx] {
            padding: 28px 20px !important;
        }

        .auth-card-wide .btn-primary[b-c010nz1knx] {
            height: 44px;
            font-size: 14px;
        }

        .auth-card-wide .form-control[b-c010nz1knx] {
            height: 42px;
            font-size: 14px;
        }
}
/* /Components/Pages/pages/Authentication/SignIn/Basic.razor.rz.scp.css */
.authentication-background[b-4rucwy84k2] {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
}

.auth-bg-wrapper[b-4rucwy84k2] {
    position: relative;
    min-height: 100vh;
}

.authentication-basic-background[b-4rucwy84k2] {
    position: absolute;
    inset: 0;
    z-index: 0;
}

    .authentication-basic-background img[b-4rucwy84k2] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.3;
    }

#login-bg[b-4rucwy84k2] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.container[b-4rucwy84k2] {
    position: relative;
    z-index: 2;
}
/* /Components/Pages/pages/Error/Error401.razor.rz.scp.css */
.page.error-bg[b-v6674bek43] {
    position: relative;
    overflow: hidden;
}

#particles-js[b-v6674bek43] {
    position: absolute;
    width: 100%;
    min-height: 100vh;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}

.page.error-bg .row[b-v6674bek43] {
    position: relative;
    z-index: 1;
}
/* /Components/Pages/pages/Error/Error404.razor.rz.scp.css */
.page.error-bg[b-xjw32d4fbi] {
    position: relative;
    overflow: hidden;
}

#particles-js[b-xjw32d4fbi] {
    position: absolute;
    width: 100%;
    min-height: 100vh;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}


.page.error-bg .row[b-xjw32d4fbi] {
    position: relative;
    z-index: 1;
}
/* /Components/Shared/BarcodeScanner.razor.rz.scp.css */
/* Modal a pantalla completa: el video de la cámara vive acá, fuera del flujo
   normal de la página. Evita que quede mal posicionado/recortado según el
   layout del div "ESCÁNER" donde vive el botón — la librería html5-qrcode
   necesita un contenedor con tamaño estable y predecible. */
.bcs-modal-backdrop[b-7ujrrs77gy] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(0, 0, 0, .85);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.bcs-viewport[b-7ujrrs77gy] {
    position: relative;
    width: 100%;
    max-width: 420px;
    aspect-ratio: 3 / 4;
    max-height: 85vh;
    background: #000;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
}

.bcs-reader[b-7ujrrs77gy] {
    width: 100%;
    height: 100%;
}

.bcs-close[b-7ujrrs77gy] {
    position: absolute;
    top: .6rem;
    right: .6rem;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

/* La librería html5-qrcode inyecta <video>/<canvas> dinámicamente vía JS,
   por eso no llevan el atributo de scope de Blazor: hay que usar ::deep. */
.bcs-reader[b-7ujrrs77gy]  video,
.bcs-reader[b-7ujrrs77gy]  canvas {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Al usar "qrbox" (recorta la zona que decodifica html5-qrcode, ver
   barcodeScanner.js) la librería dibuja SU PROPIO recuadro sombreado
   (#qr-shaded-region) — lo ocultamos porque ya tenemos nuestro propio
   marco/esquinas/láser (.bcs-overlay). El recorte para la decodificación
   sigue aplicando igual; esto solo saca el overlay visual duplicado. */
.bcs-reader[b-7ujrrs77gy]  #qr-shaded-region {
    display: none !important;
}

.bcs-overlay[b-7ujrrs77gy] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.bcs-frame[b-7ujrrs77gy] {
    position: relative;
    width: 78%;
    max-width: 300px;
    aspect-ratio: 16 / 10;
    border-radius: .75rem;
    /* Trucazo de sombra: oscurece todo lo que queda afuera del recuadro. */
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, .45);
}

.bcs-frame--success[b-7ujrrs77gy] {
    animation: bcs-pulse-b-7ujrrs77gy .45s ease;
}

.bcs-corner[b-7ujrrs77gy] {
    position: absolute;
    width: 26px;
    height: 26px;
    border: 3px solid #00e676;
    transition: border-color .2s ease;
}

.bcs-frame--success .bcs-corner[b-7ujrrs77gy] {
    border-color: #22c55e;
}

.bcs-corner--tl[b-7ujrrs77gy] {
    top: 0;
    left: 0;
    border-right: none;
    border-bottom: none;
    border-top-left-radius: .5rem;
}

.bcs-corner--tr[b-7ujrrs77gy] {
    top: 0;
    right: 0;
    border-left: none;
    border-bottom: none;
    border-top-right-radius: .5rem;
}

.bcs-corner--bl[b-7ujrrs77gy] {
    bottom: 0;
    left: 0;
    border-right: none;
    border-top: none;
    border-bottom-left-radius: .5rem;
}

.bcs-corner--br[b-7ujrrs77gy] {
    bottom: 0;
    right: 0;
    border-left: none;
    border-top: none;
    border-bottom-right-radius: .5rem;
}

.bcs-laser[b-7ujrrs77gy] {
    position: absolute;
    left: 4%;
    right: 4%;
    height: 2px;
    top: 6%;
    background: linear-gradient(90deg, transparent, #ff3b30 15%, #ff3b30 85%, transparent);
    box-shadow: 0 0 8px 1px rgba(255, 59, 48, .8);
    animation: bcs-scan-b-7ujrrs77gy 1.8s ease-in-out infinite;
}

.bcs-check[b-7ujrrs77gy] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: #22c55e;
    animation: bcs-fadein-b-7ujrrs77gy .25s ease;
}

.bcs-status[b-7ujrrs77gy] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: .6rem .75rem;
    background: linear-gradient(0deg, rgba(0, 0, 0, .75), transparent);
    text-align: center;
    pointer-events: none;
}

.bcs-status-scanning[b-7ujrrs77gy] {
    color: rgba(255, 255, 255, .85);
    font-size: .8rem;
    letter-spacing: .02em;
}

.bcs-status-code[b-7ujrrs77gy] {
    display: inline-block;
    color: #fff;
    font-family: "Courier New", monospace;
    font-weight: 700;
    font-size: .95rem;
    background: rgba(34, 197, 94, .25);
    border: 1px solid rgba(34, 197, 94, .6);
    padding: .25rem .6rem;
    border-radius: .4rem;
}

@keyframes bcs-scan-b-7ujrrs77gy {
    0% { top: 6%; }
    50% { top: 94%; }
    100% { top: 6%; }
}

@keyframes bcs-pulse-b-7ujrrs77gy {
    0% { transform: scale(1); }
    40% { transform: scale(1.06); }
    100% { transform: scale(1); }
}

@keyframes bcs-fadein-b-7ujrrs77gy {
    from { opacity: 0; transform: scale(.6); }
    to { opacity: 1; transform: scale(1); }
}