/* /Components/Layout/Drawer.razor.rz.scp.css */
.drawer-container[b-icbbewmhtw] {
    height: 100%;
}

[b-icbbewmhtw] .panel-open:not(.mobile) .menu-button-navlink:has(+ .back-button-navlink) {
    display: none;
}

[b-icbbewmhtw] .panel-open:not(.mobile) .menu-button-navlink:not(:has(+ .back-button-navlink)) {
    visibility: hidden;
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel {
    background-image: linear-gradient(180deg, var(--bs-primary, var(--dxds-primary-90)) 0%, var(--bs-black, #000) 150%);
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-content {
    overflow: auto;
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-header {
    border-bottom: none;
    padding: 2rem 1rem;
    background: none;
}

    [b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-header > .navigation-drawer-header {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-body {
    --dxbl-drawer-panel-body-padding-x: 0;
    --dxbl-drawer-panel-body-padding-y: 1rem;
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-footer {
    --dxbl-drawer-panel-footer-justify-content: center;
    border-top: none;
    padding-bottom: 1.5rem;
    width: 240px;
    background: none;
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel {
    display: flex;
}

[b-icbbewmhtw] .navigation-drawer.mobile > .dxbl-drawer-panel {
    display: none;
}

[b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-content > .navigation-drawer-shading {
    display: none;
}

@media (max-width: 768px) {
    [b-icbbewmhtw] .panel-open:not(.mobile) .menu-button-navlink:has(+ .back-button-navlink) {
        display: inline-flex;
    }

    [b-icbbewmhtw] .panel-open:not(.mobile) .menu-button-navlink:not(:has(+ .back-button-navlink)) {
        visibility: visible;
    }

    [b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-panel {
        display: none;
    }

    [b-icbbewmhtw] .navigation-drawer.mobile > .dxbl-drawer-panel {
        display: flex;
    }

    [b-icbbewmhtw] .navigation-drawer > .dxbl-drawer-content > .navigation-drawer-shading {
        background-color: var(--dxbl-drawer-content-shading-bg);
        display: block;
        height: 100%;
        position: absolute;
        transition: ease var(--dxbl-drawer-animation-duration);
        transition-property: opacity, visibility;
        visibility: visible;
        width: 100%;
        z-index: 99;
        opacity: var(--dxbl-drawer-content-shading-opacity);
    }

    [b-icbbewmhtw] .navigation-drawer.mobile.panel-closed .navigation-drawer-shading {
        opacity: 0;
        visibility: hidden;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-san5k032kh] {
    height: 100%;
    font-family: var(--bs-font-sans-serif, var(--dxds-font-family-sans-serif));
    min-height: 0;
}

.logo[b-san5k032kh] {
    text-align: center;
    height: 1.5rem;
    width: 9rem;
}

[b-san5k032kh] .icon-back {
    --icon-mask-image: var(--icon-back-mask-image);
}

[b-san5k032kh] .icon-close {
    --icon-mask-image: var(--icon-close-mask-image);
}

[b-san5k032kh] .icon-menu {
    --icon-mask-image: var(--icon-menu-mask-image);
}


[b-san5k032kh] .docs-icon {
    --icon-mask-image: var(--icon-docs-mask-image);
}

[b-san5k032kh] .demos-icon {
    --icon-mask-image: var(--icon-demos-mask-image);
}

[b-san5k032kh] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-san5k032kh] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-san5k032kh] .back-button:first-child {
    padding-left: 0;
}

[b-san5k032kh] .menu-button:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-san5k032kh] .menu-button-nav:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

.panel-open .menu-button[b-san5k032kh] {
    display: inline-flex;
}

.nav-buttons-container[b-san5k032kh] {
    display: flex;
    gap: 10px;
}

    .nav-buttons-container[b-san5k032kh]  .menubutton-float-end {
        margin-left: auto;
    }

.page-content-container[b-san5k032kh] {
    flex-grow: 1;
}

[b-san5k032kh] .drawer-content {
    display: flex;
    flex-direction: column;
    padding: 2rem 1.5rem 1.5rem 1.5rem;
}


.role-badge[b-san5k032kh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}


.avatar-container img[b-san5k032kh] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid rgba(0,0,0,0.15);
    object-fit: cover;
    transition: all 0.2s ease;
}

    .avatar-container img:hover[b-san5k032kh] {
        border-color: #3b82f6; /* azul */
        box-shadow: 0 0 0 2px rgba(59,130,246,0.2);
    }

.dark-bg .avatar-container img[b-san5k032kh] {
    border: 1.5px solid rgba(255,255,255,0.2);
}

.light-bg .avatar-container img[b-san5k032kh] {
    border: 1.5px solid rgba(0,0,0,0.15);
}




/* CONTENEDOR */
.avatar-container[b-san5k032kh] {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

    /* IMAGEN */
    .avatar-container img[b-san5k032kh] {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        object-fit: cover;
        border: 2px solid transparent;
        transition: all 0.25s ease;
    }

/* 🎨 COLORES POR ROL */
.avatar-superadmin img[b-san5k032kh] {
    border-color: #ef4444; /* rojo */
}

.avatar-admin img[b-san5k032kh] {
    border-color: #3b82f6; /* azul */
}

.avatar-user img[b-san5k032kh] {
    border-color: #10b981; /* verde */
}

.avatar-default img[b-san5k032kh] {
    border-color: #9ca3af; /* gris */
}

/* ✨ HOVER EFECTO PREMIUM */
.avatar-container:hover img[b-san5k032kh] {
    transform: scale(1.05);
    box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
}

/* 🟢 STATUS DOT */
.status-dot[b-san5k032kh] {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 12px; /* antes 10 */
    height: 12px;
    border-radius: 50%;
    border: 2px solid white; /* más contraste */
}

    /* ONLINE */
    .status-dot.online[b-san5k032kh] {
        background: #22c55e; /* verde fuerte */
        box-shadow: 0 0 0 2px rgba(34,197,94,0.3); /* glow */
    }

    /* OFFLINE */
    .status-dot.offline[b-san5k032kh] {
        background: #6b7280; /* gris más oscuro */
    }

.dark-bg .status-dot[b-san5k032kh] {
    border: 2px solid #1f2937;
}

.avatar-container.online img[b-san5k032kh] {
    border: 2px solid #22c55e;
}

.avatar-container.offline img[b-san5k032kh] {
    border: 2px solid #9ca3af;
}


.agent-status-box[b-san5k032kh] {
    padding: 12px;
}

.agent-status-line[b-san5k032kh] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.agent-status-text[b-san5k032kh] {
    font-size: 12px;
}

.agent-help-text[b-san5k032kh] {
    font-size: 12px;
    color: #6b7280;
    margin-top: 6px;
}

.retry-button[b-san5k032kh] {
    margin-top: 10px;
    width: 100%;
    padding: 6px;
    border: none;
    border-radius: 6px;
    background: #2563eb;
    color: white;
    cursor: pointer;
    font-size: 13px;
}

    .retry-button:hover[b-san5k032kh] {
        background: #1d4ed8;
    }


/* DOT */
.status-dot.online[b-san5k032kh] {
    background: #22c55e;
    box-shadow: 0 0 8px rgba(34,197,94,0.8);
    animation: pulse-green-b-san5k032kh 2s infinite;
}

@keyframes pulse-green-b-san5k032kh {
    0% {
        box-shadow: 0 0 0 0 rgba(34,197,94,0.6);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(34,197,94,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(34,197,94,0);
    }
}

/* ERROR */
.status-dot.error[b-san5k032kh] {
    background: #facc15;
    animation: pulse-warning 1.5s infinite;
}

/* SPINNER */
.spinner[b-san5k032kh] {
    width: 14px;
    height: 14px;
    border: 2px solid white;
    border-top: 2px solid transparent;
    border-radius: 50%;
    display: inline-block;
    margin-right: 6px;
    animation: spin-b-san5k032kh 1s linear infinite;
}

@keyframes spin-b-san5k032kh {
    to {
        transform: rotate(360deg);
    }
}

.agent-time[b-san5k032kh] {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
}

.btn-ok[b-san5k032kh] {
    background: #16a34a;
}

.btn-alert[b-san5k032kh] {
    background: #dc2626;
}

.retry-button[b-san5k032kh] {
    margin-top: 8px;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 5px;
}

.agent-help-text.compact[b-san5k032kh] {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
    line-height: 1.2;
}
/* /Components/Layout/ManualLayout.razor.rz.scp.css */
/*.manual-doc {
    position: fixed;  🔥 CLAVE 
    top: 0;
    left: 250px;  🔥 ajusta al ancho de tu sidebar azul 
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    background: white;
    z-index: 1;
}*/

.manual-doc-header[b-e7k0mvkxiy] {
    flex-shrink: 0;
    padding: 12px 20px;
    border-bottom: 1px solid #e5e7eb;
}

.manual-doc-body[b-e7k0mvkxiy] {
    display: flex;
    flex-direction: row;
}


.manual-root[b-e7k0mvkxiy] {
    padding: 20px;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
[b-4xu3s058sl] .menu.display-mobile {
    margin-bottom: 2rem;
}

[b-4xu3s058sl] .menu {
    --dxbl-menu-bottom-left-border-radius: 0;
    --dxbl-menu-bottom-right-border-radius: 0;
    --dxbl-menu-top-left-border-radius: 0;
    --dxbl-menu-top-right-border-radius: 0;

    background-color: inherit;
}

[b-4xu3s058sl] .menu .dxbl-menu-item-list {
    gap: 0.5rem;
}

[b-4xu3s058sl] .menu-item {
    color: var(--bs-white, #fff);
}

[b-4xu3s058sl] .icon {
    margin-left: 0.5rem;
}

[b-4xu3s058sl] .home-icon {
    --icon-mask-image: var(--icon-home-mask-image);
}

[b-4xu3s058sl] .weather-icon {
    --icon-mask-image: var(--icon-weather-mask-image);
}

[b-4xu3s058sl] .counter-icon {
    --icon-mask-image: var(--icon-counter-mask-image);
}


@media (max-width: 768px) {
    #sidebar[b-4xu3s058sl] {
        min-width: inherit;
        max-width: inherit;
        display: block;
    }

    .logo[b-4xu3s058sl] {
        text-align: inherit;
    }
}


.dxbl-navigation-filter[b-4xu3s058sl] {
    background: transparent;
}

    .dxbl-navigation-filter input[b-4xu3s058sl] {
        background: #f5f5f5;
        border: none;
    }

.menu .dxbl-treeview-node-expanded > .dxbl-treeview-node-content span[b-4xu3s058sl],
.menu .dxbl-treeview-node-has-children > .dxbl-treeview-node-content span[b-4xu3s058sl] {
    font-weight: 600;
}




.menu-link[b-4xu3s058sl] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 6px;
    color: white;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
}

.menu-activo[b-4xu3s058sl] {
    background: linear-gradient(90deg, rgba(255,255,255,0.25), transparent);
    font-weight: 600;
}

.menu-padre-activo[b-4xu3s058sl] {
    background-color: rgba(255,255,255,0.07);
}

    .menu-link span[b-4xu3s058sl] {
        color: white !important;
    }

.menu-icon[b-4xu3s058sl] {
    color: white !important;
}

/* padres */
.menu-padre[b-4xu3s058sl] {
    font-weight: 600;
}

.menu-link:hover[b-4xu3s058sl] {
    background-color: rgba(255,255,255,0.08);
    transform: translateX(2px);
}

    .menu-activo span[b-4xu3s058sl] {
        font-weight: 600;
    }

/* 🔥 MATAR SELECCIÓN Y FOCO COMPLETAMENTE */
[b-4xu3s058sl] .dxbl-treeview-node.dx-state-focused,
[b-4xu3s058sl] .dxbl-treeview-node.dx-state-selected,
[b-4xu3s058sl] .dxbl-treeview-node.dxbl-treeview-node-selected,
[b-4xu3s058sl] .dxbl-treeview-node.dxbl-treeview-node-focused {
    background: transparent !important;
}

/* 🔥 contenido interno */
[b-4xu3s058sl] .dxbl-treeview-node-content {
    background: transparent !important;
}

/* 🔥 quitar outline (focus) */
[b-4xu3s058sl] .dxbl-treeview-node:focus {
    outline: none !important;
}

/* 🔥 TU CAPA MANDA SOBRE DEVEXPRESS */
.menu-link[b-4xu3s058sl] {
    position: relative;
    z-index: 2;
    background: transparent !important;
}

/* 🔥 el nodo de DevExpress queda por detrás */
[b-4xu3s058sl] .dxbl-treeview-node-content {
    background: transparent !important;
}

.menu-link span[b-4xu3s058sl],
.menu-icon[b-4xu3s058sl] {
    position: relative;
    z-index: 3;
}

[b-4xu3s058sl] .dxbl-treeview-node-content {
    padding: 0 !important;
}
/* /Components/Pages/Admin/ClienteDetalle.razor.rz.scp.css */
.cliente-card[b-38i284altz] {
    background: white;
    border-radius: 12px;
    padding: 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* header */
.cliente-header[b-38i284altz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.cliente-nombre[b-38i284altz] {
    font-size: 18px;
    font-weight: 600;
}

.cliente-sub[b-38i284altz] {
    font-size: 13px;
    color: #888;
}

/* info */
.cliente-info[b-38i284altz] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info-item[b-38i284altz] {
    display: flex;
    justify-content: space-between;
    padding: 10px 12px;
    background: #f9fafb;
    border-radius: 8px;
}

.info-label[b-38i284altz] {
    font-size: 13px;
    color: #666;
}

.info-value[b-38i284altz] {
    font-weight: 500;
}

/* badge */
.estado-badge[b-38i284altz] {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

    .estado-badge.activo[b-38i284altz] {
        background: #e6f9ed;
        color: #16a34a;
    }

    .estado-badge.inactivo[b-38i284altz] {
        background: #fdecec;
        color: #dc2626;
    }

/* form */
.cliente-form[b-38i284altz] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-actions[b-38i284altz] {
    margin-top: 10px;
}

.cliente-metrics[b-38i284altz] {
    display: flex;
    gap: 12px;
    margin-bottom: 15px;
}

.metric[b-38i284altz] {
    flex: 1;
    background: #f9fafb;
    padding: 12px;
    border-radius: 10px;
    text-align: center;
}

.metric-value[b-38i284altz] {
    font-size: 18px;
    font-weight: 600;
}

.metric-label[b-38i284altz] {
    font-size: 12px;
    color: #888;
}


.grid-actions[b-38i284altz] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.grid-icon[b-38i284altz] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-38i284altz] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon i.bi-play[b-38i284altz] {
        color: #16a34a; /* verde */
    }

    .grid-icon i.bi-pause[b-38i284altz] {
        color: #2563eb; /* azul */
    }
/* /Components/Pages/Admin/ClientesPage.razor.rz.scp.css */
.grid-actions[b-r33cdl08gc] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.grid-icon[b-r33cdl08gc] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-r33cdl08gc] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-r33cdl08gc] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-r33cdl08gc] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }
/* /Components/Pages/Admin/Clientes/Agentes.razor.rz.scp.css */
.cliente-card[b-hbjjovv1ge] {
    background: white;
    border-radius: 12px;
    padding: 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* header */
.cliente-header[b-hbjjovv1ge] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.cliente-nombre[b-hbjjovv1ge] {
    font-size: 18px;
    font-weight: 600;
}

.cliente-sub[b-hbjjovv1ge] {
    font-size: 13px;
    color: #888;
}

/* info */
.cliente-info[b-hbjjovv1ge] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info-item[b-hbjjovv1ge] {
    display: flex;
    justify-content: space-between;
    padding: 10px 12px;
    background: #f9fafb;
    border-radius: 8px;
}

.info-label[b-hbjjovv1ge] {
    font-size: 13px;
    color: #666;
}

.info-value[b-hbjjovv1ge] {
    font-weight: 500;
}

/* badge */
.estado-badge[b-hbjjovv1ge] {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

    .estado-badge.activo[b-hbjjovv1ge] {
        background: #e6f9ed;
        color: #16a34a;
    }

    .estado-badge.inactivo[b-hbjjovv1ge] {
        background: #fdecec;
        color: #dc2626;
    }

/* form */
.cliente-form[b-hbjjovv1ge] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-actions[b-hbjjovv1ge] {
    margin-top: 10px;
}

.cliente-metrics[b-hbjjovv1ge] {
    display: flex;
    gap: 12px;
    margin-bottom: 15px;
}

.metric[b-hbjjovv1ge] {
    flex: 1;
    background: #f9fafb;
    padding: 12px;
    border-radius: 10px;
    text-align: center;
}

.metric-value[b-hbjjovv1ge] {
    font-size: 18px;
    font-weight: 600;
}

.metric-label[b-hbjjovv1ge] {
    font-size: 12px;
    color: #888;
}


.grid-actions[b-hbjjovv1ge] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.grid-icon[b-hbjjovv1ge] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-hbjjovv1ge] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-hbjjovv1ge] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-hbjjovv1ge] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }

    .grid-icon i.bi-play[b-hbjjovv1ge] {
        color: #16a34a; /* verde */
    }

    .grid-icon i.bi-pause[b-hbjjovv1ge] {
        color: #2563eb; /* azul */
    }
/* /Components/Pages/Admin/Clientes/ClienteEtiquetas.razor.rz.scp.css */
.grid-actions[b-4yr1wsoy6t] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.grid-icon[b-4yr1wsoy6t] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-4yr1wsoy6t] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-4yr1wsoy6t] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-4yr1wsoy6t] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }
/* /Components/Pages/Admin/Clientes/ClienteImpresoras.razor.rz.scp.css */
.btn-span[b-ev3t8qanh5] {
    cursor: pointer;
    display: inline-block;
    padding: 4px 10px;
    font-size: 13px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: f1f5f9; /* gris claro */
    color: #333;
    transition: all 0.15s ease;
}

    .btn-span:hover[b-ev3t8qanh5] {
        background: #d1d5db;
    }

    .btn-span:active[b-ev3t8qanh5] {
        transform: scale(0.95);
    }

.grid-actions[b-ev3t8qanh5] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.grid-icon[b-ev3t8qanh5] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-ev3t8qanh5] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon i.bi-play[b-ev3t8qanh5] {
        color: #16a34a; /* verde */
    }

    .grid-icon i.bi-pause[b-ev3t8qanh5] {
        color: #2563eb; /* azul */
    }

/* /Components/Pages/Admin/Clientes/ClienteMenuPage.razor.rz.scp.css */
/* ===== TREE ===== */

.menu-tree .dx-treeview-node[b-exqqj3nvwz] {
    padding: 6px 0;
}

.menu-tree i[b-exqqj3nvwz] {
    color: #555;
}

.menu-tree-preview[b-exqqj3nvwz] {
    background: #fafafa;
    padding: 10px;
    border-radius: 6px;
}

.menu-parent[b-exqqj3nvwz] {
    font-weight: 600;
}


/* ===== ROLES ===== */

.role[b-exqqj3nvwz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    background: transparent;
    color: #bbb;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

    .role.disabled[b-exqqj3nvwz] {
        opacity: 0.3;
        pointer-events: none;
    }

    /* HOVER SUAVE */
    .role:hover[b-exqqj3nvwz] {
        background: #f5f5f5;
        color: #555;
    }

    /* ACTIVOS */
    .role.active[b-exqqj3nvwz] {
        opacity: 1;
        color: white;
    }

    /* 👤 EMPLEADO ACTIVO */
    .role.empleado.active[b-exqqj3nvwz] {
        color: #52c41a;
        border: 1px solid rgba(82,196,26,0.3);
    }

    /* ⭐ ADMIN ACTIVO */
    .role.admin.active[b-exqqj3nvwz] {
        color: #1677ff;
        border: 1px solid rgba(22,119,255,0.3);
    }

    /* INACTIVO MÁS SUAVE */
    .role:not(.active)[b-exqqj3nvwz] {
        opacity: 0.5;
    }

    /* DESHABILITADO (cuando Activo = false) */
    .role.disabled[b-exqqj3nvwz] {
        opacity: 0.2;
        pointer-events: none;
    }

    .role.super.active[b-exqqj3nvwz] {
        background: #ff4d4f;
    }

    /* HOVER ACTIVOS */
    .role.empleado.active:hover[b-exqqj3nvwz] {
        background: #73d13d;
    }

    .role.admin.active:hover[b-exqqj3nvwz] {
        background: #4096ff;
    }

    .role.super.active:hover[b-exqqj3nvwz] {
        background: #ff7875;
    }


/* ===== TOOLBAR ===== */

.tree-toolbar-container[b-exqqj3nvwz] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 6px 10px;
    margin-bottom: 12px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}


/* ===== FORM ===== */

.form-modern[b-exqqj3nvwz] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.form-group-modern label[b-exqqj3nvwz] {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px;
    display: block;
}


/* ===== TREE INTERACTION ===== */

[draggable="true"][b-exqqj3nvwz] {
    cursor: grab;
}

.node-selected[b-exqqj3nvwz] {
    background: #e6f4ff;
    border-radius: 6px;
}


/* ===== BADGES ===== */

.badge[b-exqqj3nvwz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 12px;
    cursor: pointer;
    background: #f5f5f5;
    color: #666;
    transition: all 0.2s ease;
}

    .badge.empleado.active[b-exqqj3nvwz] {
        background: #52c41a;
        color: white;
    }

    .badge.admin.active[b-exqqj3nvwz] {
        background: #1677ff;
        color: white;
    }


/* ===== ESTADO ===== */

.badge-estado[b-exqqj3nvwz] {
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
}

    .badge-estado.on[b-exqqj3nvwz] {
        background: #52c41a;
        color: white;
    }

    .badge-estado.off[b-exqqj3nvwz] {
        background: #f5f5f5;
        color: #999;
    }

    .badge-estado:hover[b-exqqj3nvwz] {
        transform: scale(1.05);
    }


/* ===== DOT ESTADO ===== */

.estado-dot[b-exqqj3nvwz] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

    .estado-dot.on[b-exqqj3nvwz] {
        background: #52c41a;
        box-shadow: 0 0 0 2px rgba(82,196,26,0.2);
    }

    .estado-dot.off[b-exqqj3nvwz] {
        background: #d9d9d9;
    }

    .estado-dot:hover[b-exqqj3nvwz] {
        transform: scale(1.2);
    }
/* /Components/Pages/Admin/Clientes/ClienteModulos.razor.rz.scp.css */
.modulo-fila[b-v5666aj3i9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}
/* /Components/Pages/Admin/Clientes/ClienteUsuarios.razor.rz.scp.css */
.avatar[b-r77anx73cw] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.popup-form[b-r77anx73cw] {
    padding: 10px 10px 5px 10px;
}

.form-group-modern[b-r77anx73cw] {
    margin-bottom: 16px;
}

    .form-group-modern label[b-r77anx73cw] {
        display: block;
        font-weight: 600;
        font-size: 13px;
        margin-bottom: 6px;
        color: #555;
    }

.popup-row[b-r77anx73cw] {
    display: flex;
    gap: 25px;
    align-items: flex-start;
}

.popup-col[b-r77anx73cw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.popup-photo[b-r77anx73cw] {
    width: 180px;
    text-align: center;
}

.photo-box[b-r77anx73cw] {
    width: 170px;
    height: 170px;
    border: 2px dashed #d0d0d0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
    margin-bottom: 10px;
}

    .photo-box img[b-r77anx73cw] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.photo-placeholder[b-r77anx73cw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #888;
}

    .photo-placeholder i[b-r77anx73cw] {
        font-size: 28px;
    }

.form-group-modern[b-r77anx73cw] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .form-group-modern label[b-r77anx73cw] {
        font-size: 13px;
        color: #777;
        font-weight: 500;
    }

.popup-form .dx-texteditor-input[b-r77anx73cw] {
    padding: 4px 6px !important;
    font-size: 12.5px;
}

.popup-form .dx-texteditor[b-r77anx73cw] {
    height: 28px;
    border-radius: 6px;
}

.popup-form label[b-r77anx73cw] {
    font-size: 11px;
    color: #888;
}

.estado-dot[b-r77anx73cw] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
}

.estado-activo[b-r77anx73cw] {
    background-color: #16a34a; /* verde */
}

.estado-inactivo[b-r77anx73cw] {
    background-color: #dc2626; /* rojo */
}

.grid-actions[b-r77anx73cw] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.grid-icon[b-r77anx73cw] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-r77anx73cw] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-r77anx73cw] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-r77anx73cw] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }

    .grid-icon i.bi-play[b-r77anx73cw] {
        color: #16a34a; /* verde */
    }

    .grid-icon i.bi-pause[b-r77anx73cw] {
        color: #2563eb; /* azul */
    }
/* /Components/Pages/Admin/Clientes/ClienteZonas.razor.rz.scp.css */
.rfid-section[b-5k8s3wsnts] {
    padding: 20px;
}

.zona-color-dot[b-5k8s3wsnts] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #ccc;
}
/* /Components/Pages/Admin/Clientes/NuevoCliente.razor.rz.scp.css */
.wizard-steps[b-kja92bb6sm] {
    display: flex;
    align-items: center;
    padding: 24px 32px 0;
    margin-bottom: 24px;
    flex-wrap: nowrap;
    overflow-x: auto;
}

.wizard-step[b-kja92bb6sm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    min-width: 60px;
}

.step-circle[b-kja92bb6sm] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    background: #e9ecef;
    color: #6c757d;
    border: 2px solid #e9ecef;
}

.wizard-step.active .step-circle[b-kja92bb6sm] {
    background: #2f6fed;
    color: #fff;
    border-color: #2f6fed;
}

.wizard-step.done .step-circle[b-kja92bb6sm] {
    background: #198754;
    color: #fff;
    border-color: #198754;
}

.step-label[b-kja92bb6sm] {
    font-size: 11px;
    color: #6c757d;
}

.wizard-step.active .step-label[b-kja92bb6sm] { color: #2f6fed; font-weight: 600; }
.wizard-step.done .step-label[b-kja92bb6sm] { color: #198754; }

.step-connector[b-kja92bb6sm] {
    flex: 1;
    height: 2px;
    background: #e9ecef;
    min-width: 20px;
    margin-bottom: 20px;
}

.step-connector.done[b-kja92bb6sm] { background: #198754; }

.wizard-body[b-kja92bb6sm] {
    padding: 0 32px;
}

.wizard-section[b-kja92bb6sm] {
    max-width: 560px;
}

.wizard-section-title[b-kja92bb6sm] {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #1a1a2e;
}

.wizard-section-subtitle[b-kja92bb6sm] {
    font-size: 13px;
    color: #888;
    margin-bottom: 16px;
}

.modulo-row[b-kja92bb6sm] {
    padding: 6px 0;
    border-bottom: 1px solid #f0f0f0;
}

.modulo-desc[b-kja92bb6sm] {
    font-size: 12px;
    color: #888;
    font-weight: 400;
}

.wizard-resumen[b-kja92bb6sm] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
}

.wizard-resumen td[b-kja92bb6sm] {
    padding: 8px 12px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}

.wizard-resumen td:first-child[b-kja92bb6sm] {
    color: #888;
    width: 140px;
}

.wizard-footer[b-kja92bb6sm] {
    padding: 20px 32px;
    display: flex;
    align-items: center;
}

.wizard-placeholder[b-kja92bb6sm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 40px;
    background: #f8f9fa;
    border-radius: 12px;
    text-align: center;
    color: #6c757d;
    font-size: 15px;
}

.wizard-placeholder i[b-kja92bb6sm] { font-size: 2.5rem; color: #adb5bd; }

.wizard-success[b-kja92bb6sm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 16px;
    gap: 12px;
}

.required[b-kja92bb6sm] { color: #dc3545; }
/* /Components/Pages/Admin/Index.razor.rz.scp.css */
[b-ryw7fh6u40] .welcome-gridlayout {
    margin: auto;
    width: auto;
    height: auto;
}

[b-ryw7fh6u40] .welcome-gridlayout .dxbl-gridlayout-root {
    align-content: center;
    justify-content: center;
}

[b-ryw7fh6u40] .title {
    text-align: center;
}

[b-ryw7fh6u40] .welcome-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: center;
}

[b-ryw7fh6u40] .welcome-card {
    width: 26.25rem;
    height: 15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s;
    border-radius: 1rem;
    color: var(--bs-link-color, var(--dxds-primary-90));
    gap: 1.5rem;
    text-decoration: none;
    position: relative;
}

[b-ryw7fh6u40] .welcome-card:hover {
    box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1), 0px 8px 10px -6px rgba(0, 0, 0, 0.1);
}

[b-ryw7fh6u40] .welcome-card .welcome-card-img {
    width: 6.5rem;
    height: 6.5rem;
}

[b-ryw7fh6u40] .welcome-card .welcome-card-text {
    font-size: 1.75rem;
    font-weight: 600;
    letter-spacing: 0em;
    text-align: center;
    text-decoration: unset;
}

[b-ryw7fh6u40] .welcome-card .welcome-card-back {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--bs-body-color, var(--dxds-color-content-neutral-default-rest));
    opacity: 0.05;
    border-radius: 1rem;
    z-index: -2;
}
/* /Components/Pages/Admin/Rfid/Dispositivos.razor.rz.scp.css */
.rfid-section[b-td7elwkc4v] {
    padding: 20px;
}

[b-td7elwkc4v] .dxbl-grid-cell .d-flex {
    align-items: center;
}
/* /Components/Pages/Counter.razor.rz.scp.css */
.counter-block[b-4h0k08ixrj] {
    display: flex;
    padding: 2.5rem 1.5rem 1.5rem 1.5rem;
    flex-direction: column;
    border-radius: 1rem;
    gap: 1.5rem;
    justify-content: center;
    align-items: center;
    width: 16.875rem;
    height: 17rem;
    position: relative;
}

.counter-block .counter-content[b-4h0k08ixrj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.counter-block .counter-count[b-4h0k08ixrj] {
    font-size: 7.5rem;
    font-weight: 400;
    line-height: 7.75rem;
}

.counter-block .counter-block-back[b-4h0k08ixrj] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--bs-body-color, var(--dxds-color-content-neutral-default-rest));
    opacity: 0.05;
    border-radius: 1rem;
    z-index: -2;
}
/* /Components/Pages/Panel/CatalogoArticulos.razor.rz.scp.css */
.grid-icon[b-li8zj50r41] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: transform 0.1s ease, opacity 0.1s ease;
}

    .grid-icon:hover[b-li8zj50r41] {
        transform: scale(1.2);
        opacity: 0.8;
    }

    .grid-icon.delete[b-li8zj50r41] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-li8zj50r41] {
            color: #b02a37;
        }

.grid-actions[b-li8zj50r41] {
    display: flex;
    align-items: center;
    gap: 10px; /* 👈 aquí controlas la separación */
    margin-left: 8px;
}



/* /Components/Pages/Panel/Dashboard.razor.rz.scp.css */
.dashboard-card[b-o05wupmzbf] {
    text-align: center;
}

.info-circle[b-o05wupmzbf] {
    margin: 10px auto 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #eef2ff;
    color: #6366f1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.2s;
    font-size: 16px;
}

    .info-circle:hover[b-o05wupmzbf] {
        background: #6366f1;
        color: white;
    }

.users-info[b-o05wupmzbf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
}

    .info-label[b-o05wupmzbf] {
        font-size: 9px;
        color: #9ca3af;
    }

.flyout-card[b-o05wupmzbf] {
    min-width: 220px;
    padding: 12px;
}

.flyout-header[b-o05wupmzbf] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
}

.flyout-icon[b-o05wupmzbf] {
    font-size: 18px;
}

.flyout-title[b-o05wupmzbf] {
    font-size: 14px;
}

.tooltip-users[b-o05wupmzbf] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tooltip-user[b-o05wupmzbf] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
}

.card-avatar[b-o05wupmzbf] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 16px;
}

.flyout-card[b-o05wupmzbf] {
    min-width: 220px;
    padding: 12px;
}

.flyout-header[b-o05wupmzbf] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
}

.flyout-icon[b-o05wupmzbf] {
    font-size: 18px;
}

.flyout-title[b-o05wupmzbf] {
    font-size: 14px;
}

.tooltip-users[b-o05wupmzbf] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tooltip-user[b-o05wupmzbf] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
}

.avatar[b-o05wupmzbf] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: white;
    font-weight: 600;
}

.flyout-custom-usuarios .tooltip-users[b-o05wupmzbf] {
    width: 190px;
}

.flyout-custom .tooltip-users[b-o05wupmzbf] {
    width: 240px;
}


.estado-sistema[b-o05wupmzbf] {
    margin-bottom: 20px;
    padding: 12px 18px;
    border-radius: 10px;
}

    .estado-sistema h4[b-o05wupmzbf] {
        margin: 0;
    }

    .estado-sistema p[b-o05wupmzbf] {
        margin: 4px 0 0 0;
    }

.estado-success[b-o05wupmzbf] {
    background: #f0fdf4;
    border-left: 4px solid #22c55e;
    color: #166534;
    padding: 16px 20px;
    border-radius: 8px;
}

    .estado-success h4[b-o05wupmzbf] {
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 2px;
    }

    .estado-success p[b-o05wupmzbf] {
        white-space: pre-line;
        margin: 0;
        font-size: 0.8rem;
        line-height: 1.2;
        color: #15803d;
    }

.estado-warning[b-o05wupmzbf] {
    background: #fafaf9;
    border-left: 4px solid #facc15;
    color: #57534e;
    padding: 16px 20px;
    border-radius: 8px;
}

    .estado-warning h4[b-o05wupmzbf] {
        font-size: 1rem;
        font-weight: 600;
    }

    .estado-warning p[b-o05wupmzbf] {
        white-space: pre-line;
        margin: 0;
        color: #78716c;
        font-size: 0.8rem;
        line-height: 1.3;
    }

.estado-error[b-o05wupmzbf] {
    background: #fef2f2;
    border-left: 4px solid #ef4444;
    color: #7f1d1d;
    padding: 16px 20px;
    border-radius: 8px;
}

    .estado-error h4[b-o05wupmzbf] {
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 2px;
    }

    .estado-error p[b-o05wupmzbf] {
        white-space: pre-line;
        margin: 0;
        font-size: 0.8rem;
        line-height: 1.3rem;
        color: #991b1b;
    }

.card-wide[b-o05wupmzbf] {
    grid-column: 1 / -1;
}

.sin-actividad[b-o05wupmzbf] {
    margin-top: 25px;
    color: #888;
    font-size: 14px;
}
/* /Components/Pages/Panel/Impresion-ubicacion.razor.rz.scp.css */
.ubicacion-wrapper[b-jreo4e13ru] {
    display: flex;
    justify-content: center;
}

.ubicacion-card[b-jreo4e13ru] {
    width: 460px;
    padding: 35px 45px;
    background: var(--dxbl-card-bg);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15);
}

.form-title[b-jreo4e13ru] {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 25px;
}

.form-grid[b-jreo4e13ru] {
    display: grid;
    grid-template-columns: 150px auto;
    row-gap: 18px;
    column-gap: 20px;
    align-items: center;
}

.range-group[b-jreo4e13ru] {
    display: flex;
    gap: 12px;
}

.label-small[b-jreo4e13ru] {
    line-height: 1.2;
}

.total-label[b-jreo4e13ru] {
    font-size: 14px;
}

.form-actions[b-jreo4e13ru] {
    text-align: center;
    margin-top: 30px;
}

.spin-small[b-jreo4e13ru] {
    width: 70px !important;
}

    .spin-small .dxbl-spin-edit[b-jreo4e13ru] {
        width: 70px !important;
    }
/* /Components/Pages/Panel/ImpresionEtiquetas.razor.rz.scp.css */
.rfid-popup-footer[b-og7biw796r] {
    display: flex;
    justify-content: flex-end;
    padding: 12px 18px;
}

.rfid-popup-actions[b-og7biw796r] {
    display: flex;
    gap: 10px;
}


.grid-icon[b-og7biw796r] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-og7biw796r] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-og7biw796r] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-og7biw796r] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }

.grid-actions[b-og7biw796r] {
    display: flex;
    align-items: center;
    gap: 10px; /* 👈 aquí controlas la separación */
    margin-left: 8px;
}

.hide-etiqud[b-og7biw796r] {
    display: none !important;
}
/* /Components/Pages/Panel/Inventario.razor.rz.scp.css */
.header-content[b-5x67uhdqdi] {
    display: flex;
    align-items: flex-end;
}

.toolbar-title[b-5x67uhdqdi] {
    font-size: 22px;
    font-weight: 600;
}

.toolbar-filters[b-5x67uhdqdi] {
    display: flex;
    gap: 18px;
    align-items: flex-end;
    margin-left: auto; /* 👈 empuja todo a la derecha */
}

.toolbar-filter[b-5x67uhdqdi] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filter-label[b-5x67uhdqdi] {
    font-size: 12px;
    color: #666;
    font-weight: 500;
}

.toolbar-filter-button[b-5x67uhdqdi] {
    display: flex;
    align-items: flex-end;
}

.toolbar-button[b-5x67uhdqdi] {
    display: flex;
    align-items: flex-end;
    height: 100%;
    padding-top: 18px; /* ajusta si necesitas subir/bajar el botón */
}



.spin[b-5x67uhdqdi] {
    animation: spin-b-5x67uhdqdi 1s linear infinite;
}

@keyframes spin-b-5x67uhdqdi {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
/* /Components/Pages/Panel/ManualUsuario.razor.rz.scp.css */
/* =========================
   LAYOUT GENERAL
========================= */

.manual-layout[b-upl8xe5dqc] {
    display: flex;
    gap: 16px; /* 🔥 separación limpia */
    align-items: stretch;
    width: 100%;
}

/* =========================
   SIDEBAR
========================= */

[b-upl8xe5dqc] .manual-sidebar {
    width: 260px;
    flex: 0 0 260px;
    padding: 12px;
    background: #fafafa;
    border-right: 1px solid #e5e7eb;
    border-radius: 8px;
}

/* =========================
   CONTENIDO
========================= */

[b-upl8xe5dqc] .manual-main {
    flex: 1;
    padding: 24px;
    background: white;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

[b-upl8xe5dqc] .manual-main h1 {
    margin-top: 0;
    margin-bottom: 10px;
}

[b-upl8xe5dqc] .manual-content {
    margin-top: 10px;
}

/* =========================
   GRUPOS
========================= */

[b-upl8xe5dqc] .manual-group-title {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    color: #9ca3af;
    margin: 15px 10px 5px;
}

/* =========================
   ITEMS TREE
========================= */

[b-upl8xe5dqc] .manual-item {
    width: 100%;
}

/* =========================
   FILA
========================= */

[b-upl8xe5dqc] .manual-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

    /* HOVER */
[b-upl8xe5dqc] .manual-row:hover {
    background: #eef2ff;
}

    /* ACTIVO */
[b-upl8xe5dqc] .manual-row.active {
    background: #e0e7ff;
    color: #4338ca;
}

    /* PADRES */
[b-upl8xe5dqc] .manual-row.parent .manual-text {
    font-weight: 600;
    color: #111827;
}

    /* HIJOS */
[b-upl8xe5dqc] .manual-row.child .manual-text {
    font-weight: 400;
    color: #374151;
}

/* =========================
   ICONOS
========================= */

[b-upl8xe5dqc] .manual-icon {
    width: 18px;
    display: flex;
    justify-content: center;
    font-size: 14px;
}

/* =========================
   TEXTO
========================= */

.manual-text[b-upl8xe5dqc] {
    flex: 1;
    font-size: 14px;
    line-height: 1.3;
}

/* =========================
   SCROLL
========================= */

.manual-sidebar[b-upl8xe5dqc] {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}

    .manual-sidebar[b-upl8xe5dqc]::-webkit-scrollbar {
        width: 6px;
    }

    .manual-sidebar[b-upl8xe5dqc]::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 4px;
    }

/* =========================
   LAYOUT (DEEP SOLO AQUÍ)
========================= */

[b-upl8xe5dqc] .manual-doc-body {
    display: flex;
    padding: 16px; /* 🔥 margen general de página */
    background: #f3f4f6;
}
/* /Components/Pages/Panel/Notarias/Zonas.razor.rz.scp.css */
/* estilos en ClienteZonas.razor.css */
/* /Components/Pages/Panel/Trabajos.razor.rz.scp.css */
/* permite overlay */
.dx-data-row td[b-q92trgr6xs] {
    position: relative;
}

/* contenedor */
.lote-wrapper[b-q92trgr6xs] {
    position: relative;
}

/* 🔥 fila completa */
.lote-full-row[b-q92trgr6xs] {
    position: absolute;
    left: 0;
    right: -2000px; /* atraviesa todas las columnas */
    z-index: 2;
    background: #f9fafb;
    border-radius: 8px;
    padding: 8px 12px;
    margin-bottom: 6px;
}

/* contenido superior */
.lote-top[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* título */
.lote-title[b-q92trgr6xs] {
    font-weight: 600;
}

/* contador */
.lote-count[b-q92trgr6xs] {
    color: #6b7280;
}

/* acciones derecha */
.lote-actions[b-q92trgr6xs] {
    margin-left: auto;
    display: flex;
    gap: 6px;
}

/* barra */
.lote-bar[b-q92trgr6xs] {
    margin-top: 6px;
    height: 6px;
    background: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

    .lote-bar div[b-q92trgr6xs] {
        height: 100%;
        transition: width 0.4s ease;
    }

/* animación */
@keyframes pulse-b-q92trgr6xs {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.6;
    }

    100% {
        opacity: 1;
    }
}

.lote-procesando[b-q92trgr6xs] {
    animation: pulse-b-q92trgr6xs 1.5s infinite;
}

.lote-group[b-q92trgr6xs] {
    padding: 6px 10px;
    transition: background 0.3s ease;
}

.lote-procesando[b-q92trgr6xs] {
    animation: pulseSoft-b-q92trgr6xs 1.8s ease-in-out infinite;
}

@keyframes pulseSoft-b-q92trgr6xs {
    0% {
        box-shadow: 0 0 0 0 rgba(59,130,246,0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(59,130,246,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(59,130,246,0);
    }
}

.grid-lotes .dx-row[b-q92trgr6xs] {
    background: white;
    border-radius: 10px;
    margin-bottom: 10px;
}

/* LOTE */
.lote-row[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    padding: 10px;
}

.lote-left[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lote-title[b-q92trgr6xs] {
    font-weight: 600;
}

.lote-fecha[b-q92trgr6xs] {
    font-size: 12px;
    color: #6b7280;
}

.lote-count[b-q92trgr6xs] {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 999px;
    font-weight: 600;
}

.lote-estado[b-q92trgr6xs] {
    font-size: 12px;
    font-weight: 600;
}

/* TRABAJOS */
.trabajos-container[b-q92trgr6xs] {
    padding: 10px 20px;
}

.trabajo-row[b-q92trgr6xs] {
    display: flex;
    justify-content: space-between;
    padding: 8px 10px;
    border-bottom: 1px solid #eee;
}

.trabajo-left[b-q92trgr6xs] {
    display: flex;
    gap: 20px;
    align-items: center;
}

.trabajo-id[b-q92trgr6xs] {
    width: 50px;
}

.trabajo-articulo[b-q92trgr6xs] {
    min-width: 200px;
}

.trabajo-estado[b-q92trgr6xs] {
    min-width: 120px;
}

.trabajo-fecha[b-q92trgr6xs] {
    color: #6b7280;
    font-size: 12px;
}

.trabajo-actions[b-q92trgr6xs] {
    display: flex;
    gap: 5px;
}

.grid-lotes .dx-row[b-q92trgr6xs] {
    background: white;
    border-radius: 10px;
    margin-bottom: 10px;
}

/* LOTE */
.lote-row[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    padding: 10px;
}

.lote-left[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lote-title[b-q92trgr6xs] {
    font-weight: 600;
}

.lote-fecha[b-q92trgr6xs] {
    font-size: 12px;
    color: #6b7280;
}

.lote-count[b-q92trgr6xs] {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 999px;
    font-weight: 600;
}

.lote-estado[b-q92trgr6xs] {
    font-size: 12px;
    font-weight: 600;
}

/* DETALLE */
.trabajos-container[b-q92trgr6xs] {
    padding: 10px 20px;
}

/* MINI GRID LIMPIO */
.grid-detalle[b-q92trgr6xs] {
    border: none;
}

    .grid-detalle .dx-header-row[b-q92trgr6xs] {
        background: transparent;
        font-size: 12px;
    }

    .grid-detalle .dx-datagrid-rowsview[b-q92trgr6xs] {
        border: none;
    }

    .grid-detalle .dx-row[b-q92trgr6xs] {
        background: transparent;
    }

        .grid-detalle .dx-row > td[b-q92trgr6xs] {
            padding-top: 6px;
            padding-bottom: 6px;
        }

.grid-actions[b-q92trgr6xs] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: 6px; /* opcional */
}

.grid-icon[b-q92trgr6xs] {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

    .grid-icon:hover[b-q92trgr6xs] {
        background: rgba(0,0,0,0.05);
        transform: scale(1.15);
    }

    .grid-icon.delete[b-q92trgr6xs] {
        color: #dc3545;
    }

        .grid-icon.delete:hover[b-q92trgr6xs] {
            background: rgba(220,53,69,0.1);
            color: #b02a37;
        }


.lote-error[b-q92trgr6xs] {
    font-size: 12px;
    color: #dc2626;
    margin-left: 8px;
}
